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的点击事件

live,on,delegate,bind使用方法知识点

时间: 2024-10-12 09:39:37

live,on,delegate,bind使用方法知识点的相关文章

jQuery的delegate()与proxy()方法

1. jQuery 事件 - delegate() 方法 定义和用法 delegate() 方法为指定的元素(属于被选元素的子元素)添加一个或多个事件处理程序,并规定当这些事件发生时运行的函数. 使用 delegate() 方法的事件处理程序适用于当前或未来的元素(比如由脚本创建的新元素). $("div").delegate("button","click",function(){ $("p").slideToggle();

js apply/call/caller/callee/bind使用方法与区别分析

一.call 方法 调用一个对象的一个方法,以另一个对象替换当前对象(其实就是更改对象的内部指针,即改变对象的this指向的内容). Js代码 call([thisObj[,arg1[, arg2[, [,.argN]]]]]) 参数 thisObj 可选项.将被用作当前对象的对象. arg1, arg2, , argN 可选项.将被传递方法参数序列. 说明 call 方法可以用来代替另一个对象调用一个方法.call 方法可将一个函数的对象上下文从初始的上下文改变为由 thisObj 指定的新对

js经验点滴js apply/call/caller/callee/bind使用方法与区别分析

一.call 方法 调用一个对象的一个方法,以另一个对象替换当前对象(其实就是更改对象的内部指针,即改变对象的this指向的内容). Js代码 call([thisObj[,arg1[, arg2[, [,.argN]]]]]) 参数 thisObj 可选项.将被用作当前对象的对象. arg1, arg2, , argN 可选项.将被传递方法参数序列. 说明 call 方法可以用来代替另一个对象调用一个方法.call 方法可将一个函数的对象上下文从初始的上下文改变为由 thisObj 指定的新对

mount --bind使用方法

我们可以通过mount --bind命令来将两个目录连接起来,mount --bind命令是将前一个目录挂载到后一个目录上,所有对后一个目录的访问其实都是对前一个目录的访问,如下所示: ## test1 test2为两个不同的目录 linux-UMLhEm:/home/test/linux # ls test1 11.test 1.test linux-UMLhEm:/home/test/linux # ls test2 22.test 2.test linux-UMLhEm:/home/tes

C# delegate的匿名方法

jQuery事件绑定on()、bind()、live()与delegate() 方法详解

jQuery事件绑定有四个方法,对应为on,off,bind,unbind,delegate,undelegate,live,die 比较和联系: 1.bind()函数只能针对已经存在的元素进行事件的设置:但是live(),on(),delegate()均支持未来新添加元素的事件设置: 2.bind()函数在jquery1.7版本以前比较受推崇,1.7版本出来之后,官方已经不推荐用bind(),替代函数为on(),这也是1.7版本新添加的函数,同样,可以 用来代替live()函数,live()函

jQuery事件绑定on()、bind()与delegate() 方法详解

本文转载:啃了一段日子的js相关了,学的过程中发现在jQuery中绑定事件时,有人用bind(),有人用on(),有人用delegate(),还有人用live(),看代码的时候觉得都实现功能了也就掀过去了,只是一直没完全弄懂之间的区别,于是今天查了下资料,自己做个总结. 之所以有这么多类型的绑定方法,是因为jQuery的版本更新的原因,如on()方法就是1.7以后出现的. jQuery的事件绑定api页面上,提到live()方法已经过时,不建议使用.所以这里我们主要就看下以下三个方法:bind(

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

转载自:http://zhuzhichao.com/2013/12/differences-between-jquery-bind-vs-live/ 我见过很多开发者很困惑关于jQuery中的.bind(), .live(), .delegate() 和 .on() 的使用以及它们的不同. 如果你没有耐心或者只想看到总结的话,请直接跳转到结尾. 在我们深入了解这些方法之前,先准备好HTML代码. [javascript] view plain copy <pre> <ul id=&quo

jQuery 2.0.3 源码分析 事件绑定 - bind/live/delegate/on

转:http://www.cnblogs.com/aaronjs/p/3440647.html?winzoom=1 事件(Event)是JavaScript应用跳动的心脏,通过使用JavaScript ,你可以监听特定事件的发生,并规定让某些事件发生以对这些事件做出响应 事件的基础就不重复讲解了,本来是定位源码分析实现的, 所以需要有一定的基础才行 为了下一步更好的理解内部的实现,所以首先得清楚的认识到事件接口的划分 网上资料遍地都是,但是作为一个jQuery系列的源码分析,我还是很有必要在重新