live可以说是bind是方法的变种。

二者的主要区别就是live方法的作用机理是事件委托,live方法的作用机理是将事件绑定DOM的根节点上。

live方法的处理机制就是把事件绑定在DOM树的根节点上,而不是直接绑定在某个元素上。举一个例子来说明:

$(".clickMe").live("click",fn);

$("body").append("<div class='clickMe'>测试live方法的步骤</div>");

当我们点击这个新增的元素时会依次发生如下步骤:

(1)生成一个click事件,传递给div来做处理

(2)由于没有事件直接绑定在div上,所以事件直接冒泡到DOM树上

(3)事件不断冒泡,直到DOM树的根节点上,默认情况下,根节点上就绑定了这个click事件

(4)执行由live绑定的click事件

(5)检测绑定事件的对象是否存在,判断是否需要继续执行绑定的事件。检测事件对象是通过检测

$(event.target).closest('.clickMe') 能否找到匹配的元素来实现的。

(6)通过(5)的测试,如果绑定事件的对象存在的话,就执行绑定的事件。

由于只有在事件发生的时候,live方法才会去检测绑定事件的对象是否存在,所以live方法可以实现后来新增的元素也可实现事件的绑定。相比之下,bind会在事件在绑定阶段就会判断绑定事件的元素是否存在,而且只针对当前元素进行绑定,而不是绑定到父节点上。

所以bind是只能对当前存在的元素绑定事件,l对后来新增的元素无效。live对后来新增的元素也是有效的。

关于jquery中的事件绑定bind()和live()的更多相关文章

  1. Jquery中的事件绑定$(&quot;#btn&quot;).bind(&quot;click&quot;,function(){ })

    Jquery中的事件绑定:$("#btn").bind("click",function(){  }) 由于每次都这么调用太麻烦,所以jquery就用$(&qu ...

  2. jQuery中的事件绑定方法

    在jQuery中,事件绑定方法大致有四种:bind(),live(), delegate(),和on(). 那么在工作中应该如何选择呢?首先要了解四种方法的区别和各自的特点. 在了解这些之前,首先要知 ...

  3. jQuery 中的事件绑定

    一.事件概念 和数据库中的触发器一样,当操作了数据的时候会引发对应的触发器程序执行 一样,JS 中的事件就是对用户特定的行为作出相应的响应的过程,其实上就是浏览器 监听到用户的某些行为的时候会执行对应 ...

  4. jQuery中是事件绑定方式--on、bind、live、delegate

    概述:jQuery是我们最常用的js库,对于事件的绑定也是有很多种,on.one.live.bind.delegate等等,接下来我们逐一来进行讲解. 本片文章中事件所带的为版本号,例:v1.7+为1 ...

  5. jQuery 中的事件绑定与取消绑定

    1:在jQuery中使用bind方法进行事件的绑定,bind方法有两个参数,第一个参数是事件的类型例如click,change,keyup,keydown,blur,focus等.第二个参数是一个回调 ...

  6. js和jQuery中的事件绑定与普通事件

    普通事件,是指直接对元素进行事件注册,然后触发 而事件绑定是将事件注册到元素上 两者区别就是在于普通事件不可以重复添加多个事件,若添加也会覆盖,只会触发其中一个事件(最后注册的那个) 而事件绑定是可以 ...

  7. jQuery中的事件绑定的几种方式

    jQuery目前有on(),bind(),delegate(),live()四种绑定方式,但是随着版本的不断更新,有的方式也相应的被淘汰掉 [band()方式绑定] 3.0版本之前的绑定方式比较常用的 ...

  8. jQuery学习笔记(三)jQuery中的事件

    目录 加载DOM 事件绑定 合成事件 事件冒泡 移除事件 一.加载DOM Javascript 与HTML之间的交互是通过用户操作浏览器页面引发的事件来处理的.jQuery提供了丰富的事件处理机制.从 ...

  9. jQuery中的事件与动画 (你的明天Via Via)

    众所周知,页面在加载时,会触发load事件:当用户单击某个按钮时,会触发该按钮的click事件. 这些事件就像日常生活中,人们按下开关,灯就亮了(或者灭了),往游戏机里投入游戏币就可以启动游戏一样, ...

随机推荐

  1. ddd

    MIIBIjANBgkqhkiG9w0BAQEFAAOCAQ8AMIIBCgKCAQEAqiYF+Y89+3wKwCtvDOCJ6qQifvC+snwHsZEy6naujvCHXkeB/BcDDwnq ...

  2. dom4j-1.6.1.jar与dom4j-1.4.jar

    今天在上线的项目中遇到一个很奇怪的问题 File file = new File("O:/20160817/91a2cb1c-62eb-4a31-a1f6-3af8ab71782a/adi6 ...

  3. 控制边框颜色:《CSS3 Border-color》

    CSS3中有关于Border的属性一共有三个:圆角border-radius,图片边框border-images,边框多颜色border-color,其中圆角border-radius是常用的一个属性 ...

  4. 【MySQL】MySQL快速插入大量数据

    起源 在公司优化SQL遇到一个索引的问题,晚上回家想继续验证,无奈没有较多数据的表,于是,想造一些随机的数据,用于验证. 于是 于是动手写.由于自己不是MySQL能手,写得也不好.最后,插入的速度也不 ...

  5. HashMap代码示例

    package com.shushine.framework.第七章Java标准类库;import java.util.HashMap;import java.util.Iterator;import ...

  6. 计算城市间的球面距离(C++实现)

    #include<iostream> #include<string> #include<cmath> #include<iomanip> using ...

  7. Linux架构

    Linux架构   作者:Vamei 出处:http://www.cnblogs.com/vamei 欢迎转载,也请保留这段声明.谢谢! 我以下图为基础,说明Linux的架构(architecture ...

  8. python走起之第二话

    Python基础 一.整数(int) 如: 18.73.84 整数类的功能方法及举例: 带__的方法代表有多种表达方式 1.__abs__ <==> abs() 求整数的绝对值:(-11) ...

  9. 《BI项目笔记》增量ETL数据抽取的策略及方法

    增量抽取 增量抽取只抽取自上次抽取以来数据库中要抽取的表中新增或修改的数据.在ETL使用过程中.增量抽取较全量抽取应用更广.如何捕获变化的数据是增量抽取的关键.对捕获方法一般有两点要求:准确性,能够将 ...

  10. (转) C++中基类和派生类之间的同名函数的重载问题

    下面有关派生类与基类中存在同名函数 fn: class A { public: void fn() {} void fn(int a) {} }; class B : public A { publi ...