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()的更多相关文章

  1. jquery实现input输入框实时输入触发事件代码 ---jQuery 中bind(),live(),delegate(),on() 区别

    复制代码 代码如下: <input id="productName" name="productName" value="" /> ...

  2. jQuery事件绑定方法bind、 live、delegate和on的区别

    我们试图绑定一些事件到DOM元素上的时候,我相信上面这4个方法是最常用的.而它们之间到底有什么不同呢?在什么场合下用什么方法是最有效的呢? 1.准备知识 当我们在开始的时候,有些知识是必须具备的: 1 ...

  3. jQuery事件:bind、delegate、on的区别

    最近在AngularJS的开发中,遇到一个神奇的事情:我们用到livebox来预览评论列表中的图片, 然而评论列表是由Angular Resource动态载入的.不可思议的是,点击这些动态载入的图片仍 ...

  4. jquery 未来元素事件示例 on() delegate() live()

    jquery 1.7版后建议使用on() $(document).on("click","#green",function(){$(this).after('& ...

  5. jQuery 中bind(),live(),delegate(),on() 区别(转)

    当我们试图绑定一些事件到DOM元素上的时候,我相信上面这4个方法是最常用的.而它们之间到底有什么不同呢?在什么场合下用什么方法是最有效的呢? 准备知识: 当我们在开始的时候,有些知识是必须具备的: D ...

  6. 转 jQuery 中bind(),live(),delegate(),on() 区别

    当我们试图绑定一些事件到DOM元素上的时候,我相信上面这4个方法是最常用的.而它们之间到底有什么不同呢?在什么场合下用什么方法是最有效的呢? 准备知识: 当我们在开始的时候,有些知识是必须具备的: D ...

  7. 解密jQuery事件核心 - 委托设计(二)

    第一篇 http://www.cnblogs.com/aaronjs/p/3444874.html 从上章就能得出几个信息: 事件信息都存储在数据缓存中 对于没有特殊事件特有监听方法和普通事件都用ad ...

  8. 深入学习jQuery事件绑定

    × 目录 [1]bind [2]trigger [3]delegate[4]on[5]one 前面的话 javascript有HTML.DOM0级.DOM2级和IE这四种事件处理程序,而jQuery对 ...

  9. jQuery源代码学习之九—jQuery事件模块

    jQuery事件系统并没有将事件坚挺函数直接绑定在DOM元素上,而是基于事件缓存模块来管理监听函数的. 二.jQuery事件模块的代码结构 //定义了一些正则 // // //jQuery事件对象 j ...

随机推荐

  1. redmine生产环境搭建

    记录信息: 搭建基础应用及mysql 配置svn 配置自动重启 配置API开放 配置邮箱发送 开启数据库ip访问权限 确认用户组管理:配置用户同步 配置部门同步

  2. Promise在await报错后,如何继续往下跑...

    一.resolve 当a>0时,正常情况依次输出A.B.C console.log("A"); let result = await this.test(); console ...

  3. ios中的coredata的使用

    Core Data数据持久化是对SQLite的一个升级,它是iOS集成的,在说Core Data之前,我们先说说在CoreData中使用的几个类. (1)NSManagedObjectModel(被管 ...

  4. vue之创建组建

    vue的核心基础就是组件的使用,玩好了组件才能将前面学的基础更好的运用起来.组件的使用更使我们的项目解耦合.更加符合vue的设计思想MVVM. 那接下来就跟我看一下如何在一个Vue实例中使用组件吧! ...

  5. QrenCode : 命令行下生成二维码图片

    对于二维码大家应该并不陌生,英文名为 2-dimensional bar code 或 QR Code,是一种用图形记载信息的技术,最常见的是应用在手机应用上.用户通过手机摄像头扫描二维码或输入二维码 ...

  6. POJ-1975 Median Weight Bead(Floyed)

    Median Weight Bead Time Limit: 1000MS Memory Limit: 30000K Total Submissions: 3162 Accepted: 1630 De ...

  7. HDU-2680 Choose the best route 单向边+反向dijkstra

    https://vjudge.net/problem/HDU-2680 题意:以起始点 终点 长度 给出一个图,已知可以从w个起点出发,求从任一起点到同一个终点s的最短路径.注意是单向边.m<1 ...

  8. 东哥讲义2 - 基于TCP,UDP协议的攻击,分析与防护

    TCP SYN FLOOD 攻击 正常的TCP三次握手过程: 处于SYN FLOOD攻击状态时的三次握手过程: 查看示例:x_syn.c文件,一个实现了自定义mac,ip,tcp头部的syn floo ...

  9. 网站优化不等于搜索引擎优化SEO

    对于SEO相信搞网络营销的人基本上都知道这个名词,英文全称为search engine optimization,中文一般叫搜索引擎优化,也有的叫搜索引擎定位(Search Engine Positi ...

  10. 网站优化(SEO)的10大误区

    前段时间大前端也有关于SEO的文章贡献给广大读者,今日,再发一文,网站优化(SEO)的10大误区.很多新手站长初次接触SEO,感受到SEO 的无穷魅力,想要做一位优秀的SEOer,然而新手朋友在进行S ...