jQuery,使用on代替delegate,live 写法区别
早期对页面上后期加载的动态元素,赋事件或值的时候,是使用live的. 由于效率比较低(其实数据不多也感觉不出来),后面使用delegate委托来代替了,再后面,1.7以后使用on 来代替delegate了. live,delegate在新版本中都还可以用. 它们在写法上有差别,一段时间不写容易混,写下来备忘. 如点击div里的任意一个button时增加一个新button:
脚本:
1.1 使用live
jQuery版本1.3+
$('.btnAdd').live('click', function () {
$(this).clone().appendTo('#panel');
});
1.2 直接把live改成on, 没有给范围比如#panel,这对页面上一开始有的按钮有效. 也就是说无法直接这样代替live
$('.btnAdd').on('click', function () {
$(this).clone().appendTo('#panel');
});
2.使用delegate 需要给它一个范围才行,如#panel,让它到里面找.这样可以实现live一样的效果.
jQuery版本1.4.3+
$('#panel').delegate('.btnAdd', 'click', function () {
$(this).clone().appendTo('#panel');
});
3.使用on 给它一个范围才行,如#panel,让它到里面找. 这样可以实现live和delegate一样的效果.
里面的'click', '.btnAdd'跟上面的delegate是相反的.只要记住on click是挨在一起的就行了.
jQuery版本1.7+
$('#panel').on('click', '.btnAdd', function () {
$(this).clone().appendTo('#panel');
});
jQuery,使用on代替delegate,live 写法区别的更多相关文章
- 谈 jquery中.band() .live() .delegate() .on()的区别
bind(type,[data],fn) 为每个匹配元素的特定事件绑定事件处理函数 $("a").bind("click",function(){alert(& ...
- jquery中bind,live,delegate,on的区别
这几种方法都是绑定事件用到的,但是他们之间有些差别 bind(type,[data],fn) 为每个匹配元素的特定事件绑定事件处理函数 例如: <ul> <a href=" ...
- 【转】jQuery中.bind() .live() .delegate() .on()的区别
bind(type,[data],fn) 为每个匹配元素的特定事件绑定事件处理函数 $("a").bind("click",function(){alert(& ...
- jQuery中.bind() .live() .delegate() .on()的区别
bind(type,[data],fn) 为每个匹配元素的特定事件绑定事件处理函数 $("a").bind("click",function(){alert(& ...
- jQuery中.bind() .live() .delegate() .on()的区别 和 三种方式写光棒事件 动画
地狱的镰刀 bind(type,[data],fn) 为每个匹配元素的特定事件绑定事件处理函数. $("a").bind("click",function(){ ...
- jQuery中bind() live() delegate() on() 的区别
实例 bind(type,[data],fn) 为每个匹配元素的特定事件绑定事件处理函数 $("a").bind("click",function(){aler ...
- jQuery 中bind(),live(),delegate(),on() 区别(转)
当我们试图绑定一些事件到DOM元素上的时候,我相信上面这4个方法是最常用的.而它们之间到底有什么不同呢?在什么场合下用什么方法是最有效的呢? 准备知识: 当我们在开始的时候,有些知识是必须具备的: D ...
- 转 jQuery 中bind(),live(),delegate(),on() 区别
当我们试图绑定一些事件到DOM元素上的时候,我相信上面这4个方法是最常用的.而它们之间到底有什么不同呢?在什么场合下用什么方法是最有效的呢? 准备知识: 当我们在开始的时候,有些知识是必须具备的: D ...
- jquery实现input输入框实时输入触发事件代码 ---jQuery 中bind(),live(),delegate(),on() 区别
复制代码 代码如下: <input id="productName" name="productName" value="" /> ...
随机推荐
- 关于 Unchecked cast from Iterator to Iterator String 提示
遇到个这个提示:Unchecked cast from Iterator to Iterator String Iterator<String> keys = data.keys(); 修 ...
- chd校内选拔赛题目+题解
题目链接 A. Currency System in Geraldion 有1时,所有大于等于1的数都可由1组成.没有1时,最小不幸的数就是1. #include<iostream> ...
- 关于ios原声嵌入web页面的问题
当在一个界面中既有原生又有web的时候,如果想让上下整体滑动的话,我们怎么确定web的高度呢,下面分享一下我的心得 首先在webView的代理方法中我们可以获取到加载完整个web页面的高度 - (vo ...
- percentiles of live data capture
For example, every ten seconds I got a server response time, I want to know the 90 percentile respon ...
- sql server 查询表基本信息sql
SELECT c.name,t.name TYPE,c.max_length,c.precision,c.scale,p.value FROM sys.systypes t INNER JOIN sy ...
- mac版tomcat修改端口无法访问,80端口无法访问
在mac上安装好了tomcat,修改了端口为80,没想到关闭tomcat时提示出错,而且无法访问,原来我犯了两个错误. 1.我用的是mac上的文本编辑.app打开然后修改的,重新修改为8080也不行, ...
- Java继承多态中的方法访问权限控制
java中的方法天生具有继承多态特性,这点与C++有很大不同(需要在父类方发上加virtual关键字),但用起来确实方便了许多. 最简单的继承多态 声明一个接口BaseIF,只包含一个方法声明 pub ...
- Struts2 stracture
- python学习day2
一.模块初识 python模块 模块让你能够有逻辑地组织你的Python代码段. 把相关的代码分配到一个 模块里能让你的代码更好用,更易懂. 模块也是Python对象,具有随机的名字属性用来绑定或引用 ...
- log4j2
转载自 Blog of 天外的星星: http://www.cnblogs.com/leo-lsw/p/log4j2tutorial.html Log4j 2的好处就不和大家说了,如果你搜了2,说明你 ...