如果没有参数,则删除所有绑定的事件。如果提供了事件类型,则只删除该类型的绑定事件。如果把在绑定时传递的处理函数作为第二个参娄和,则只有这个特定事件处理函数才会被删除,例如:
$("#delAll").click()( $("#btn").unbind("click"); );
one()方法的结构与bind()方法类似,使用方法也与bind()方法相,语法结构如下:
one(type[,data],fn);
使用one()方法为元素帮定事件后,只在第一次触发时执行,之后毫无作用。
1.7 模拟操作
有时需要通过模拟用户操作,来达到单击效果,可以使用trigger()方法完成,例如:
$("#btn").trigger("click");
也可以直接用简化写法click()来达到同样的效果。
trigger(type[,data])方法有两个参数,第二个参数是要传递给事件处理函数的附加数据,以数组形式传递。
trigger()方法触发事件后,会执行浏览器默认操作,例如:
$("input").trigger("focus");
以上代码不仅会触发focus事件,也会使input元素本身得到焦点,如果不想执行浏览器默认操作,可以使用另一个类似的方法triggerHandler()方法。
2. 动画
2.1 show()方法和hide()方法
show()方法和hide()方法是jQuery中最基本的动画方法。为一个元素调用hide()方法,会将该元素的display样式改为"none",例如:
$("#mydiv").hide();
当把元素隐藏后,可以使用show()方法将元素的display样式设置为先前的显示状态,例如:
$("#mydiv").show();
show()方法可以指定一个速度参数,例如,指定一个速度关键字"slow",例如:
$("#mydiv").show("slow");
运行该代码后,元素将在600毫秒内慢慢显示,其他的速度关键字还有"normal"和"fast",不仅如此,还可以为显示速度指定一个数字,单位是毫秒。
2.2 fadeIn()方法和fadeOut()方法
与show()方法不同的时,fadeIn()和fadeOut()方法只改变元素的不透明度。fadeOut()方法会在指定时间内降低元素的不透明度,直到元素完全消失。fadeIn()方法则相反,例如:
$("#mydiv").fadeOut();
2.3 slideUp()方法和slideDown()方法
slideUp()方法和slideDown()方法只会改变元素的高度。如果一个元素的display属性值为"none",当调用slideDown()方法时,这个元素将由上至下延伸显示。slideUp()方法正好相反,元素将由下到上缩短隐藏,例如:
$("#mydiv").slideDown();
2.4 自定义动画方法animate()
如果需要采取一些高级的自定义动画来解决更多控制的问题,可以使用animate()方法来自定义动画,语法结构为:
animate(params,speed,callback);
params包含样式属性及值的映射,比如{property1:"value1",property2:"value2",...},speed是可选的速度参数,callback是在动画完成时执行的函数,例如:
$("#mydiv").animate({left:"+=500px"},300);
"+="符号或"-="符号即表示在当前位置累加或者累减。如果需要同时执行多个动画,可以写如下代码:
$("#mydiv").animate({left:"500px",height:"200px"},3000);
如果只想按顺序执行动画,只需把代码拆开即可,例如:
$("#mydiv").animate({left:"500px"},3000); $("#mydiv").animate({height:"200px"},3000);
或者:
$("#mydiv").animate({left:"500px"},3000).animate({height:"200px"},3000);
2.5 停止动画和判断是否处于动画状态
很多时候需要停止匹配元素正在进行的动画,需要使用stop()方法,语法结构为:
stop([clearQueue][,gotoEnd]);
参数clearQueue和gotoEnd都是可选的参数,为Boolean值,clearQueue代表是否要清空未执行完的动画队列,gotoEnd代表是否直接将正在执行的动画跳转到末状态。
在使用animate()方法的时候,要避免动画积累而导致的动画与用户的行为不一致,解决方法是判断元素是否正处于动画状态,例如:
if(!$("#mydiv").is("animated")){ }
2.6 其他动画方法
jQuery中还有3个专门用于交互的动画方法:toggle(speed,[callback]),slideToggle(speed,[callback]),fadeTo(speed,opacity,[callback])。
toggle()方法可以切换元素的可见状态,例如:
$("#mydiv").click(function(){ $(this).next("div.content").toggle(); });
slideToggle()方法通过高度变化来切换匹配元素的可见性,例如:
$("#mydiv").click(function(){ $(this).next("div.content").slideToggle(); });
fadeTo()方法可以把元素的不透明度以渐进方式调整到指定的值,例如:
$("#mydiv").click(function(){ $(this).next("div.content").fadeTo(600,0.2); });
总结