一、绑定事件
jQuery中通过bind()方法来为元素绑定这些事件(click, mousedown, mouseover, mousemove, change, select, blur, focus,等等),可以传递三个参数bind(type,[data],fn),type表示一个或多个类型的事件名字符串;[data]可选,作为event,data属性值传递一个额外的数据,这个数据是一个字符串、一个数字、一个数组或一个对象;fn表示绑定到指定元素的处理函数。
几种格式:
1、$('div').bind('click',function(){})
2、$('div').bind('click',fn1) (function fn(){}单独定义)
3、也可以绑定多个事件 $('div').bind('click mouseover',function(){})
4、另一种写法 $('div').bind({
mouseover:function(){},
click:function(){}
})
有绑定必然有解除绑定事件:unbind()
$('div').unbind() 该方法内部也可以传参,删除指定的事件,或者删除指定事件的指定方法。
Ps如果对于同种方法(比如click)的不同绑定function,想删除其中一个,就不太方便了,这时候可以利用命名空间来进行删除。
eg: $('input').bind('click.a',function(){})
$('input').bind('click.b',function(){})
$('input').unbind('click.a')即可
二、简化事件
为了方便,jQuery提供了简写的方式,如下表所示:
Ps:mouseenter(),mouseleave()穿过其子元素不会触发,mouseover(),mouseout()则会触发。
Pps:keydown(),keyup()返回的是键码,keypress()返回的是字符编码
Ppps:focus()和blur()必须是当前元素才能激活,focusin()和focusout()可以是子元素激活
三、复合事件
jQuery提供了许多常用的事件效果,组合一些功能实现了复合事件,比如切换功能,智能加载等。
1、ready()封装了load()方法,里面加入了很多判断。
2、hover()相当于复合了mouseenter和mouseleave()。
3、toggle()已被废弃。