jQuery事件处理的特征(事件命名机制)

JQuery中的bind()和unbind()，提供了事件的绑定和取消机制，既可以绑定html默认支持的事件，也能够绑定自定义的事件。JQuery支持自定义事件，这显然给编程带来了极大的灵活性。下面就一起学习下，jquery事件处理的一些特性。

1、JQuery中事件可以重复绑定，不会覆盖。

$("#button1").bind("click",function(){alert("func1");});$("#button1").bind("click",function(){alert("func2");});

当点击button1的时候，这2个事件处理函数都会触发。也许你会说，上面绑定的是不同的匿名函数，占用不同的内存空间。的确是这样的，不过就算是同一个处理函数，依然存在重复绑定问题。当button1被点击的时候，下面的事件处理函数同样会被调用2次。

$("#button1").bind("click",sameFunc);$("#button1").bind("click",sameFunc);function sameFunc(){alert("func");}

绝大部分场景下，事件处理函数都只需要绑定一次，所以一定要注意JQuery事件的重复绑定这个特性，事件多次执行，就算没有bug，终究也不是好的做法。

2、使用bind一次绑定多个事件和处理函数。

如果多个事件需要注册相同的处理函数，那么可以使用如下代码进行简化(事件名称使用空格分隔)：

$("#button1").bind("mousedown mouseup",function(){console.log(11);});

如果每个事件的处理函数不同，那么可以使用如下的方式(json对象)：

$("#button1").bind({"mousedown":function(){console.log("mousedown");},"mouseup":function(){console.log("mouseup");}});

3、传递event对象和自定义参数。

一般来说，使用jquery的时候我们很少需要event对象，也不需要向事件处理函数传递自定义的参数。不过如果我们真的需要这么做，JQuery也是支持的。

$("#button1").bind("click", {name:"aty"}, function(eventObject){ alert("params=" + eventObject.data.name); });

eventObject很像IE和FF中的event对象，通过它能够获取事件发生时更详细的信息。如果我们指定了自定义的参数，那么JQuery会将它放在事件对象的data属性中，即通过eventObject.data就能够拿到我们传递的参数值。

4、事件取消的三种形式。

unbind用来取消之前通过bind绑定的事件处理函数，总的来说有三种形式：取消所有事件、取消某种类型的事件、取消某种类型下的某个事件处理函数。

假如我们给button1绑定了click、mouseup、mousedown事件，其中click事件绑定2个处理函数。

$("#button1").bind("click",function(eventObj){ console.log("click1"); }); $("#button1").bind("click",function(eventObj){ console.log("click2"); }); $("#button1").bind("mouseup",function(eventObj){ console.log("mouseup"); }); $("#button1").bind("mousedown",function(eventObj){ console.log("mousedown"); });