职业IT人-IT人生活圈

 找回密码
 成为会员
搜索
查看: 383|回复: 1

事件委托在jQuery和KISSY内核中的应用

[复制链接]
broken 发表于 2011-8-27 10:34 | 显示全部楼层 |阅读模式
原文地址 http://x1989.com/a/459.html
一直觉得jQuery中的 .live() 方法很神奇,居然可以对动态加入的元素进行绑定。今天终于弄明白了,原来这是通过使用事件委托实现的。
   $('a').live('click', function(){
      //code block1
   })
   上面的这段代码可以约等于(但不完全等于,在最后说明了为什么):
   $(document).bind('click', function(e){
      if(e.srcElement.tagName == 'a'){
         //code block1
      }
   })
   此外,jQuery还有一个 .delegate() 方法,可以实现接近 .live() 的效果:
   $('#container').delegate('a','click',function(){
      //code block2
   })
   jQuery在文档中查找#container,并使用click事件和’a'这一CSS选择器作为参数,把函数绑定到$(‘#container’)上。任何时候只要有事件冒泡到$(‘#container’)上,它就查看该事件是否是click事件,以及该事件的目标元素是否与CSS选择器相匹配。如果两种检查的结果都为真的话,它就执行绑定的函数。
在KISSY 1.2版本中也引入了 .delegate() 方法。
这两种方法中,个人觉得还是 .delegate() 方法效率高。因为 .live() 方法需要把选择器匹配到的元素都包装成jQuery对象;而 .delegate() 方法只在委托的节点上监听冒泡事件。感觉用 .live() 方法进行事件委托比较鸡肋啊,可能这也是为什么其他js框架没有类似方法的原因吧。


 楼主| broken 发表于 2011-8-27 10:35 | 显示全部楼层
推荐链接
见证又一个准百万富翁的诞生!

20-30万急聘多名天才Java/MTA软件工程师
3G培训就业月薪平均7K+,不3K就业不花一分钱!

您需要登录后才可以回帖 登录 | 成为会员

本版积分规则

QQ|手机版|小黑屋|网站帮助|职业IT人-IT人生活圈 ( 粤ICP备12053935号-1 )|网站地图
本站文章版权归原发布者及原出处所有。内容为作者个人观点,并不代表本站赞同其观点和对其真实性负责,本站只提供参考并不构成任何投资及应用建议。本站是信息平台,网站上部分文章为转载,并不用于任何商业目的,我们已经尽可能的对作者和来源进行了通告,但是能力有限或疏忽造成漏登,请及时联系我们,我们将根据著作权人的要求立即更正或者删除有关内容。

GMT+8, 2024-4-29 16:41 , Processed in 0.124435 second(s), 20 queries , Gzip On.

Powered by Discuz! X3.4

Copyright © 2001-2021, Tencent Cloud.

快速回复 返回顶部 返回列表