直接事件和委托事件

原创
2016/03/21 15:10
阅读数 239

有很多人问过我这个问题,如下:


$('ul li').on('click', function () {
   //TODO
});

$('ul').on('click', 'li', function () {
   //TODO
});


这两段代码有何区别?

jquery的官网文档中有详细的解释:

第1段的意思是把事件直接绑定在li上面,如果有N个li,那么就相当于绑定了N次li。而且只能绑定到文档中已经存在的li上面,后续添加的li是绑定不上的,比如通过ajax添加进去的新的li。 这就是直接事件绑定。

第2段是委托事件,也叫代理事件,只绑定了一次事件到li上面,也可以监听到后续添加的li。

两者的使用场景是有细微区别的,如果你只需要对已有的dom节点绑定事件,可以用第一种写法,也可以用第二种,

而当你需要全量监听时,特别是针对ajax动态引入的dom节点进行事件绑定时,应该用第二种。





展开阅读全文
打赏
1
2 收藏
分享
加载中
挺有用的小知识
2016/03/21 20:45
回复
举报
更多评论
打赏
1 评论
2 收藏
1
分享
返回顶部
顶部