谈 jquery中.band() .live() .delegate() .on()的区别

bind(type,[data],fn) 为每个匹配元素的特定事件绑定事件处理函数

$("a").bind("click",function(){alert("ok");});

live(type,[data],fn) 给所有匹配的元素附加一个事件处理函数,即使这个元素是以后再添加进来的

$("a").live("click",function(){alert("ok");});

delegate(selector,[type],[data],fn) 指定的元素(属于被选元素的子元素)添加一个或多个事件处理程序,并规定当这些事件发生时运行的函数

$("#container").delegate("a","click",function(){alert("ok");})

on(events,[selector],[data],fn) 在选择元素上绑定一个或多个事件的事件处理函数

区别:

@1   .bind()是直接绑定在元素上

@2   .live()则是通过冒泡的方式来绑定到元素上的。更适合列表类型的,绑定到document DOM节点上。和.bind()的优势是支持动态数据。

@3   .delegate()则是更精确的小范围使用事件代理,性能优于.live()

@4   .on()则是最新的1.9版本整合了之前的三种方式的新事件绑定机制

时间: 2024-10-28 16:18:47

谈 jquery中.band() .live() .delegate() .on()的区别的相关文章

jQuery中 .bind() .live(). delegate() . on() 的区别

jQuery中   .bind()    .live().   delegate() .   on()  的区别 这几种方法都是绑定事件用到的,但是他们之间有些差别 bind(type,[data],fn) 为每个匹配元素的特定事件绑定事件处理函数 例如: <ul> <a href="#"><li>1111111</li></a> <a href="#"><li>22222</

jquery中bind,live,delegate,on的区别

这几种方法都是绑定事件用到的,但是他们之间有些差别 bind(type,[data],fn) 为每个匹配元素的特定事件绑定事件处理函数 例如: <ul> <a href="#"><li>1111111</li></a> <a href="#"><li>22222</li></a> <a href="#"><li>33

jquery中html 与 text方法的区别

jquery中html 与 text方法的区别 24 May 2012/in 网站设计和开发 /by Bruce 接鉵jquery的时间并不长,以前都是用直接用js写的,现在发现在jquery这个框架用起来很方便,不但代码量少了,使用也比较简单,对于浏览器的兼容问题也不用担心,在使用的过程中也会遇到一些疑问,在html标签中附加子标签时所用的方法html()与text()的区别. 通常在用jquery写ajax时,都会用到html()这个方法,而不用text()这个方法,他们之间有什么区别呢?

jQuery中的closest()和parents()的区别

jQuery中的closest()和parents()的区别 jQuery中closest()和parents()的作用非常相似,都是向上寻找符合选择器条件的元素,但是他们之间有一些细微的差别,官网也给出了说明: .closest() .parents() Begins with the current element Begins with the parent element Travels up the DOM tree until it finds a match for the sup

jQuery 中的children()和 find() 的区别

<!DOCTYPE html> <html> <head> <script type="text/javascript" src="/jquery/jquery.js"></script> </head> <body> <ul class="level-1"> <li class="item-i">I</li>

jquery 中 on 和普通绑定的区别

都说on是用于动态添加的元素的事件.但是你不觉得奇怪嘛,难道动态添加的元素就不能用普通的事件绑定,这样说不通啊! 其实是on可以在元素添加到dom之前绑定,而对于普通绑定,只要元素已经出现在了dom中,不论是否动态添加  事件当然也是生效的 $('body').on('click', '.d1', function(event) { //event.preventDefault(); console.log('on0');//ok }); console.log($('.d1')); $('.d

jquery中this与$(this)的用法区别

jquery中this与$(this)的用法区别.先看以下代码: $("#textbox").hover( function() { this.title = "Test"; }, fucntion() { this.title = "OK”; } ); 这里的this其实是一个Html 元素(textbox),textbox有text属性,所以这样写是完全没有什么问题的. 但是如果将this换成$(this)就不是那回事了,就会报错了. 以下写法是错误的

浅谈Jquery中的bind(),live(),delegate(),on()绑定事件方式

前言 因为项目中经常会有利用jquery操作dom元素的增删操作,所以会涉及到dom元素的绑定事件方式,简单的归纳一下bind,live,delegate,on的区别,以便以后查阅,也希望该文章日后能帮助到园友,文中如有不当之处,还望各位指正,话不多说,直接进入正题. bind() 简要描述 bind()向匹配元素添加一个或多个事件处理器. 使用方式 $(selector).bind(event,data,function) event:必需项:添加到元素的一个或多个事件,例如 click,db

转 jQuery 中bind(),live(),delegate(),on() 区别

当我们试图绑定一些事件到DOM元素上的时候,我相信上面这4个方法是最常用的.而它们之间到底有什么不同呢?在什么场合下用什么方法是最有效的呢? 准备知识: 当我们在开始的时候,有些知识是必须具备的: DOM树 下图仅仅是一个示例,这是一个在browser环境下的一棵模拟DOM树,在下面的代码中仅起到演示的作用: Event bubbling (aka event propagation)冒泡 我们的页面可以理解为一棵DOM树,当我们在叶子结点上做什么事情的时候(如click一个a元素),如果我们不