码迷,mamicode.com
首页 > Web开发 > 详细

对jQuery中on方法委托事件的理解

时间:2015-05-16 18:35:27      阅读:132      评论:0      收藏:0      [点我收藏+]

标签:jquery on 委托事件

关于on方法中的委托事件,官方JQ API如下:

http://api.jquery.com/on/#on-events-selector-data-handler

参考大牛阮一峰的博文:

http://www.ruanyifeng.com/blog/2011/08/jquery_best_practices.html


什么时候使用委托事件:

1.对未被创建的元素添加事件监听

2.避免频繁添加或删除event handler,委托父元素来进行事件处理


使用委托事件的优点:

1.大量减少监听元素的开销


使用实例

$( "#dataTable tbody" ).on( "click", "tr", function() {
  console.log( $( this ).text() );
});

使用后果,不用每个tr都进行事件绑定,只需要在tbody处进行绑定即可,委托tbody进行对tr点击的响应。


对于on的第二个参数,官方API的解释是:对触发事件元素的后代元素的过滤

个人理解:过滤之后,this变成tr,事件冒泡到tbody,然后对tr进行操作。






本文出自 “Rocker” 博客,请务必保留此出处http://rocker.blog.51cto.com/6314218/1651898

对jQuery中on方法委托事件的理解

标签:jquery on 委托事件

原文地址:http://rocker.blog.51cto.com/6314218/1651898

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!