toggle用法(toggles)
jQuery点击改变class并toggle及toggleClass()方法定义用法
我滴古老风格,废话不多说,贴代码了。
head
meta
charset="utf-8"
title/title
script
type="text/javascript"
src=""/script
style
.bg1
{
background-image:url(images/21.jpg);
background-repeat:no-repeat;
color:#0CF;
}
.bg2
{
background-image:url(images/22.jpg);
background-repeat:no-repeat;
color:#F00;
}
/style
script
type="text/javascript"
//参数para1:希望隐藏元素的id值
function
toggle1(para1){
if
($("#p2").attr("class")=="bg1")
{
$("#p2").attr("class","bg2");
}
else
{
$("#p2").attr("class","bg1");
}
$("#"+para1).toggle();
}
/script
/head
body
p
id="p1"此处将显示或隐藏/p
p
id="p2"
class="bg1"
onClick="toggle1('p1')"
style="height:31px"点击此处显示或隐藏上面部分并更换自己的样式(包括背景图、字体等)/p
/body
/html
jQuery
toggleClass()
方法
实例
对添加和移除所有
p
元素的
"main"
类进行切换:
$("button").click(function(){
$("p").toggleClass("main");
});
定义和用法
toggleClass()
方法对添加和移除被选元素的一个或多个类进行切换。
该方法检查每个元素中指定的类。如果不存在则添加类,如果已设置则删除之。这就是所谓的切换效果。
然而,通过使用
"switch"
参数,您能够规定只删除或只添加类。
语法
$(selector).toggleClass(classname,function(index,currentclass),switch)
jQuery toggle()方法报错
jQuery toggle()方法报错是因为用法不对,正确的用法如下:
定义和用法
toggle() 方法用于绑定两个或多个事件处理器函数,以响应被选元素的轮流的 click 事件。
该方法也可用于切换被选元素的 hide() 与 show() 方法。
注意:向 Toggle 事件绑定两个或更多函数
当指定元素被点击时,在两个或多个函数之间轮流切换。
如果规定了两个以上的函数,则 toggle() 方法将切换所有函数。例如,如果存在三个函数,则第一次点击将调用第一个函数,第二次点击调用第二个函数,第三次点击调用第三个函数。第四次点击再次调用第一个函数,以此类推。
举例说明:
切换不同的背景色:
$("p").toggle(
function(){
$("body").css("background-color","green");},
function(){
$("body").css("background-color","red");},
function(){
$("body").css("background-color","yellow");}
);
matlab双位按钮toggle的用法
双位按钮toggle回调函数中加上如下代码:
val=get(handles.togglebotton,'Value');
switch val
case 1
set(handles.togglebotton,'String','停止')
%开始循环播放一个文件;
case 0
set(handles.togglebotton,'String','开始播放)
%停止如上循环。
end
jquery里的toggle怎么用?
toggle(fn,fn)
每次点击时切换要调用的函数。
如果点击了一个匹配的元素,则触发指定的第一个函数,当再次点击同一元素时,则触发指定的第二个函数。随后的每次点击都重复对这两个函数的轮番调用。
可以使用unbind("click")来删除。
返回值
jQuery
参数
fn (Function) : 第奇数次点击时要执行的函数。
fn (Function) : 第偶数次点击时要执行的函数。
示例
对表格的切换一个类
jQuery 代码:
$("td").toggle(
function () {
$(this).addClass("selected");
},
function () {
$(this).removeClass("selected");
}
);
补充:toggle只有点击的时候好使,hover只是鼠标移进移出的事件,跟点击没关系。两个可以一起用