jquery事件 on(),live(),delegate(),blind()
jQuery推出on()的目的有2个,一是为了统一接口,二是为了提高性能,
所以从现在开始用on()替换bind(), live(), delegate吧。
尤其是不要再用live()了,因为它已经处于不推荐使用列表了[1.7+已经被删除]。
如果只绑定一次事件,那接着用one()吧,这个没有变化。
on(events,[selector],[data],fn)
- events:一个或多个用空格分隔的事件类型和可选的命名空间,如"click"或"keydown.myPlugin" 。
- selector:一个选择器字符串用于过滤器的触发事件的选择器元素的后代。如果选择器为null或省略,当它到达选定的元素,事件总是触发。
- data:当一个事件被触发时要传递event.data给事件处理函数。
- fn:该事件被触发时执行的函数。 false 值也可以做一个函数的简写,返回false。
替换bind()
当第二个参数'selector'为null时,on()和bind()其实在用法上基本上没有任何区别了,所以我们可以认为on()只是比bind()多了一个可选的'selector'参数,所以on()可以非常方便的替换掉bind()
最后有一点,原先的live()方法,处理函数是默认绑定在document对象上不能变的,如果DOM嵌套结构很深,事件冒泡通过大量祖先元素会导致较大的性能损失。而使用.on()方法,事件只会绑定到$()函数的选择符表达式匹配的元素上,因此可以精确地定位到页面中的一部分,而事件冒泡的开销也可以减少。delegate()与on()同理,毕竟是用on()实现的。

jquery事件 on(),live(),delegate(),blind()的更多相关文章
- jquery实现input输入框实时输入触发事件代码 ---jQuery 中bind(),live(),delegate(),on() 区别
复制代码 代码如下: <input id="productName" name="productName" value="" /> ...
- jQuery事件绑定方法bind、 live、delegate和on的区别
我们试图绑定一些事件到DOM元素上的时候,我相信上面这4个方法是最常用的.而它们之间到底有什么不同呢?在什么场合下用什么方法是最有效的呢? 1.准备知识 当我们在开始的时候,有些知识是必须具备的: 1 ...
- jQuery事件:bind、delegate、on的区别
最近在AngularJS的开发中,遇到一个神奇的事情:我们用到livebox来预览评论列表中的图片, 然而评论列表是由Angular Resource动态载入的.不可思议的是,点击这些动态载入的图片仍 ...
- jquery 未来元素事件示例 on() delegate() live()
jquery 1.7版后建议使用on() $(document).on("click","#green",function(){$(this).after('& ...
- jQuery 中bind(),live(),delegate(),on() 区别(转)
当我们试图绑定一些事件到DOM元素上的时候,我相信上面这4个方法是最常用的.而它们之间到底有什么不同呢?在什么场合下用什么方法是最有效的呢? 准备知识: 当我们在开始的时候,有些知识是必须具备的: D ...
- 转 jQuery 中bind(),live(),delegate(),on() 区别
当我们试图绑定一些事件到DOM元素上的时候,我相信上面这4个方法是最常用的.而它们之间到底有什么不同呢?在什么场合下用什么方法是最有效的呢? 准备知识: 当我们在开始的时候,有些知识是必须具备的: D ...
- 解密jQuery事件核心 - 委托设计(二)
第一篇 http://www.cnblogs.com/aaronjs/p/3444874.html 从上章就能得出几个信息: 事件信息都存储在数据缓存中 对于没有特殊事件特有监听方法和普通事件都用ad ...
- 深入学习jQuery事件绑定
× 目录 [1]bind [2]trigger [3]delegate[4]on[5]one 前面的话 javascript有HTML.DOM0级.DOM2级和IE这四种事件处理程序,而jQuery对 ...
- jQuery源代码学习之九—jQuery事件模块
jQuery事件系统并没有将事件坚挺函数直接绑定在DOM元素上,而是基于事件缓存模块来管理监听函数的. 二.jQuery事件模块的代码结构 //定义了一些正则 // // //jQuery事件对象 j ...
随机推荐
- 单例模式全面学习(C++版)
单例模式:用来创建独一无二的,只能够有一个实例的对象. 单例模式的结构是设计模式中最简单的,但是想要完全实现一个线程安全的单例模式还是有很多陷阱的,所以面试的时候属于一个常见的考点~ 单例模式的应用场 ...
- [工具] Snipaste
https://zh.snipaste.com/ Snipaste 是一个简单但强大的截图工具,也可以让你将截图贴回到屏幕上! 下载并打开 Snipaste,按下 F1 来开始截图, 选择“复制到剪贴 ...
- Unity3D笔记 愤怒的小鸟<四> 实现Selelction界面
一直跟着龚老师用js写,VS智能感应用习惯后发现这里用js对初学者比较蛋疼,MONO有提示但是还是无法和VS媲美就目前来看.所以这次还是换成熟悉的VS来开发. 目标:实现关卡页面 跑起来的效果如下: ...
- 8.28 jQuery
2018-8-28 18:25:27 jQuery 参考:https://www.cnblogs.com/liwenzhou/p/8178806.html 2018-8-28 19:53:19 还是讲 ...
- Spring Framework核心概念之Bean生命周期管理
目录 Spring Bean的生命周期 相关接口的分类 测试SpringBean生命周期的Demo程序 小结 Spring Bean的生命周期 Spring容器既Application或者WebApp ...
- Mapreduce其他部分
1.hadoop的压缩codec Codec为压缩,解压缩的算法实现. 在Hadoop中,codec由CompressionCode的实现来表示.下面是一些实现: 可分割性:可分割与不可分割的区别:文 ...
- os.path 模块
os.path.abspath(path) #返回绝对路径 os.path.basename(path) #返回文件名 os.path.commonprefix(list) #返回list(多个路径) ...
- redux+react-redux+示例的快速上手体验
刚学习redux的同学提供一些可供参考的例子. 之前用vue用了很久 vue的语法糖用起来是真的舒服 react 其实毕竟他们都是类似的框架, 虽然语法大不同, 但是有些地方的思想还是很像的, 废话 ...
- 多线程情况下HashMap死循环的问题
1.多线程put操作后,get操作导致死循环. 2.多线程put非null元素后,get操作得到null值. 3.多线程put操作,导致元素丢失. 死循环场景重现 下面我用一段简单的DEMO模拟Has ...
- LoadRunner-关联相关(解决方法二)
用例为:添加通知,下发给用户. 录制好脚本,replay时脚本未报错,但实际登录网页操作未完成(只添加了通知,未下发给用户). LR自动关联没有内容,手动查看服务器response,在保存时有一个id ...