jQuery live与bind的区别
平时在使用jQuery进行AJAX操作的时候,新生成的元素事件会失效,有时候不得不重新绑定一下事件,但是这样做很麻烦。例如评论分页后对评论内容的JS验证会失效等。在jQuery1.3之前有一个插件会解决这个问题http://plugins.jquery.com/project/livequery ,jQuery1.3增加了一个live()方法,下面是手册上的说明:
jQuery 1.3中新增的方法。给所有当前以及将来会匹配的元素绑定一个事件处理函数(比如click事件)。也能绑定自定义事件。
目前支持 click, dblclick, mousedown, mouseup, mousemove, mouseover, mouseout, keydown, keypress, keyup。
还不支持 blur, focus, mouseenter, mouseleave, change, submit
与bind()不同的是,live()一次只能绑定一个事件。
这个方法跟传统的bind很像,区别在于用live来绑定事件会给所有当前以及将来在页面上的元素绑定事件(使用委派的方式)。比如说,如果你给页面上所有的li用live绑定了click事件。那么当在以后增加一个li到这个页面时,对于这个新增加的li,其click事件依然可用。而无需重新给这种新增加的元素绑定事件。
.live()与流行的liveQuery插件很像,但有以下几个主要区别:
- .live 目前只支持所有事件的子集,支持列表参考上面的说明。
- .live 不支持liveQuery提供的“无事件”样式的回调函数。.live只能绑定事件处理函数。
- .live 没有”setup”和”cleanup”的过程。因为所有的事件是委派而不是直接绑定在元素上的。
要移除用live绑定的事件,请用die方法
用法示例:
<div class=”myDiv”></div>
jquery:
$(“.myDiv”).live(“click”, function(){
alert(“clicked!”);
});
如果使用javascript动态创建一个class为mydiv的元素,点击元素依然会有弹出。为什么使用live后就有了呢?这是因为jquery利用了事件的冒泡机制,直接把事件绑定在了document上,然后通过event.target找出事件的来源。这跟jquery.livequery插件不一样,jquery.livequery每20毫秒做一次检查,如有新生成则重新绑定一次事件。
使用live当然有利也有弊:
好处就是:元素更新时不用反复去定义事件。
坏处就是:把事件绑定在document上会在页面上每一个元素都呼叫一次,如使用不当会严重影响性能。而且不支持blur, focus, mouseenter, mouseleave, change, submit。
jQuery live与bind的区别的更多相关文章
- jquery .live() .delegate() .bind() .click()区别
什么是.live()? 除了让你对Dom元素现在和将来绑定事件之外,.live() 方法和.bind()方法很像.你可以用.live()方法对没有存在的Dom节点绑定事件.考虑下面的情况. 当用户要离 ...
- jQuery中的.bind()、.live()和.delegate()之间区别分析
jQuery中的.bind()..live()和.delegate()之间区别分析,学习jquery的朋友可以参考下. DOM树 首先,可视化一个HMTL文档的DOM树是很有帮助的.一个简单的 ...
- jQuery中的bind() live() delegate()之间区别分析
jQuery中的bind() live() delegate()之间区别分析 首先,你得要了解我们的事件冒泡(事件传播)的概念,我先看一张图 1.bind方式 $('a').bind('click', ...
- jquery的trigger和triggerHandler区别
网上关于这个问题都是抄来抄去的,都没怎么说清楚.所以自己做了个测试,供大家参考指教.首先先看API怎么说的 为了检验一下,编写了一个简单的测试代码,如下: <html lang="en ...
- jQuery介绍 DOM对象和jQuery对象的转换与区别
jQuery介绍 DOM对象和jQuery对象的转换与区别 jQuery介绍 jQuery: http://jquery.com/ write less, do more. j ...
- javascript中apply、call和bind的区别,容量理解,值得转!
a) javascript中apply.call和bind的区别:http://www.cnblogs.com/cosiray/p/4512969.html b) 深入浅出 妙用Javascrip ...
- jquery生产和开发的区别
今天说一下jquery生产和开发的区别,在我们下载jquery的时候,会有两个下载链接,一个是jquery.min.js .迷你版 (生产),另一个是 jquery.js .开发版 .不知道的人可能就 ...
- JQuery this和$(this)的区别及获取$(this)子元素对象的方法
1.JQuery this和$(this)的区别 相信很多刚接触JQuery的人,很多都会对$(this)和this的区别模糊不清,那么这两者有什么区别呢? 首先来看看JQuery中的 $() 这 ...
- JS 中的this指向问题和call、apply、bind的区别
this的指向问题 一般情况下this对象指向调用函数的对象,全局环境中执行函数this对象指向window. function a(){ console.log(this); //输出函数a中的th ...
随机推荐
- LAMP安装配置过程
Mysql ./configure --prefix=/usr/local/mysql (注意/configure前有“.”,是用来检测你的安装平台的目标特征的,prefix是安装路径) #make ...
- 【BZOJ】【2253】【WC 2010 BeijingWC】纸箱堆叠
树套树 Orz zyf 我的树套树不知道为啥一直WA……只好copy了zyf的写法TAT 这题还可以用CDQ分治来做……但是蒟蒻不会…… //y坐标的树状数组是按权值建的……所以需要离散化…… /** ...
- 【BZOJ】【3524】【POI2014】Couriers
可持久化线段树 裸可持久化线段树,把区间第K大的rank改成num即可……(往儿子走的时候不减少) 苦逼的我……MLE了一次(N*30),RE了一次(N*10)……数组大小不会开…… 最后开成N*20 ...
- [转载]DirectoryEntry配置IIS7出现ADSI Error:未知错误(0x80005000)
一.错误情况 环境:win7+iis7.0 DirectoryEntry配置IIS7出现如下错误 或者是 下面一段代码在IIS6.0下运转正常,但IIS7.0下运转会出错: System.Direct ...
- matlab中读取txt数据文件(txt文本文档)
matlab中读取txt数据文件(txt文本文档) 根据txt文档不同种类介绍不同的读取数据方法 一.纯数据文件(没有字母和中文,纯数字) 对于这种txt文档,从matalb中读取就简单多了 例如te ...
- 【锋利的JQuery-学习笔记】切换网页皮肤-且保存于Cookie
切换网页皮肤: html片段: <head> <link rel="stylesheet" href="styles/skin/skin_0.css&q ...
- PHP 打印函数之 print print_r
print 说明 int print ( string $arg ) 输出 arg print 实际上不是一个函数(它是一个语言结构),因此你可以不必使用圆括号来括起它的参数列表 参数 arg:输入数 ...
- POJ 2568/ZOJ 1965 Decode the Tree
题意:在树中,每次删去节点值最小的叶子结点. 每删去一个点,就给出与这相连的点的值,直到最后只剩下一个根结点,给这N-1个数,重新建立这个树. 思路: 给出的节点号按次序存入到数组a中,将未给出的数存 ...
- 表单插件——form
表单插件——form 通过表单form插件,调用ajaxForm()方法,实现ajax方式向服务器提交表单数据,并通过方法中的options对象获取服务器返回数据,调用格式如下: $(form). a ...
- 【mongoDB基础篇①】安装与常用操作语句
简述 mongoDB与redis同为noSql数据库,但是redis为kv数据库(key/value),而mongoDB为文档型数据库存储的是文档(Bson->json的二进制化).内部执行引擎 ...