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 ...
随机推荐
- [spring]启动时报错:NoSuchMethodError: javax.servlet.http.HttpServletResponse.getStatus()I
Spring V4.1以后的版本在不支持Servlet3.0的应用服务器上跑时会报如下错误: NoSuchMethodError: javax.servlet.http.HttpServletResp ...
- PhyreEngine3.8 MSAA resolution
There is something wrong in PhyreEngine 3.8 to fullfill MSAA, actually, I think it is eqaa You have ...
- 关于vs2010 起始页
vs2010 起始页不显示怎么解决 工具 ---> 选项---->环境---->启动---->启动时(选项框),然后点击框尾的下拉三角按钮,点选"显示起始页" ...
- java Socket用法详解(转)
在客户/服务器通信模式中, 客户端需要主动创建与服务器连接的 Socket(套接字), 服务器端收到了客户端的连接请求, 也会创建与客户连接的 Socket. Socket可看做是通信连接两端的收发器 ...
- Silverlight弹出层(转载)
ChildWindow为Silverlight中的弹出子窗口 可以在项目新建子窗口文件: 相互传值: //父窗体向子窗体传值,需要在ChildWindow中构造函数进行传值ChildWindowTes ...
- C# 知识笔记
HttpContext.Request.Form.ToString() 获取Form表单中的内容 /// <summary> /// 获取 GET 提交方式值 /// </summa ...
- hdu 2582 f(n) 数学
打表找规律: 当n为质数是,GCD(n)=n; 当n为质数k的q次方时,GCD(n)=k; 其他情况,GCD(n)=1. 代码如下: #include<iostream> #include ...
- lintcode:最大子数组II
题目 最大子数组 II 给定一个整数数组,找出两个不重叠子数组使得它们的和最大. 每个子数组的数字在数组中的位置应该是连续的. 返回最大的和. 样例 给出数组[1, 3, -1, 2, -1, 2], ...
- linux上tomcat安装
转载:http://my.oschina.net/zmf/blog/309484 tomcat安装 下载后解压:tar -zxvf apache-tomcat-7.0.28 移动到/usr/local ...
- linux快速修改文件夹及文件下所有文件与文件夹权限
分两部分改属主和权限: 更改权限,递归方式 chmod -R 755 /var/www/html/test.com 更改属主,递归 chown -R apache:apache /var/www/ht ...