jQuery中的事件绑定方法

Posted 2020-08-26 summer0319

在jQuery中，事件绑定方法大致有四种：bind(),live(), delegate(),和on()。

那么在工作中应该如何选择呢？首先要了解四种方法的区别和各自的特点。

　　在了解这些之前，首先要知道，不管你用的是（live/ bind / delegate)之中那个方法，最终都是jQuery底层都是调用on方法来完成最终的事件绑定;.unbind(), .die(), .undelegate(),也是一样的都是通过.off()来实现的;

　　因此从某种角度来讲除了在书写的方便程度及习惯上挑选，不如直接都采用on方法来的痛快和直接

　　所以在新版的API中都这么写到:

　　　　.on()方法事件处理程序到当前选定的jQuery对象中的元素。在jQuery 1.7中，.on()方法 提供绑定事件处理的所有功能

 

 

.bind() ：没有事件委托机制。

.live() : 高版本的jQuery不支持.live()方法，所以该方法应该少使用。不支持链式调用。

.delegate : $( elements ).delegate( selector, events, data, handler );

.on : $( elements ).on( events, [selector], data, handler ); 

注意：

　　.delegate 和 .on()的参数的顺序区别

 

总结：

• 在下列情况下，应该使用.live()或.delegate()，而不能使用.bind()：

　　　　为DOM中的很多元素绑定相同事件；

　　　　为DOM中尚不存在的元素绑定事件；

• 用.bind()的代价是非常大的，它会把相同的一个事件处理程序hook到所有匹配的DOM元素上
• 不要再用.live()了，它已经不再被推荐了，而且还有许多问题
• .delegate()会提供很好的方法来提高效率，同时我们可以添加一事件处理方法到动态添加的元素上

我们可以用.on()来代替上述的3种方法

不足点也是有的：

• 并非所有的事件都能冒泡，如load, change, submit, focus, blur