首页 > 代码库 > live,on,delegate,bind使用方法知识点
live,on,delegate,bind使用方法知识点
最近对于事件绑定处理用的比较多,进行总结一下
bind
单个元素的事件绑定
扫描文档找出所有的$(‘a‘)元素,并把alert函数绑定到每个元素的click事件上。
$(‘a‘).bind(‘click‘,function(){alert(‘That tickles!‘);})
备注:
bind并不能对未来添加的元素绑定事件;原理和直接$("a").click是同一机制
live
作为事件冒泡的流程,默认将事件绑定到$(document)元素上,采用事件代理的模式
任何时候只要有事件冒泡到document节点上,它就查看该事件是否是一个如:click事件,以及该事件的目标元素与‘a‘这一CSS选择器是否匹配,如果都是的话,则执行函数。$(‘a‘).live(‘click‘,function(){alert(‘That tickles!‘)})
备注:以上代码首先要扫描整个的文档查找所有的$(‘a‘)元素,把它们存成jQuery对象,效率较低;
只能监听css选择器
delegate
和live很相似,需要指定事件代理的监听方,效率高于live
$(‘#container‘).delegate(‘a‘,‘click‘,function(){alert(‘That tickles!‘)})
备注:当很多元素需要监听时,较低开销
on
jquery1.7之后的推荐事件绑定用法
.on( events [, selector] [, data], handler(eventObject) )
普通使用
$("a").on("click",function(){})
事件代理使用
$("div").on("click","a",function(){})
监听div标签下a的点击事件
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。