关于jquery中的事件绑定bind()和live()
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()的更多相关文章
- Jquery中的事件绑定$("#btn").bind("click",function(){ })
Jquery中的事件绑定:$("#btn").bind("click",function(){ }) 由于每次都这么调用太麻烦,所以jquery就用$(&qu ...
- jQuery中的事件绑定方法
在jQuery中,事件绑定方法大致有四种:bind(),live(), delegate(),和on(). 那么在工作中应该如何选择呢?首先要了解四种方法的区别和各自的特点. 在了解这些之前,首先要知 ...
- jQuery 中的事件绑定
一.事件概念 和数据库中的触发器一样,当操作了数据的时候会引发对应的触发器程序执行 一样,JS 中的事件就是对用户特定的行为作出相应的响应的过程,其实上就是浏览器 监听到用户的某些行为的时候会执行对应 ...
- jQuery中是事件绑定方式--on、bind、live、delegate
概述:jQuery是我们最常用的js库,对于事件的绑定也是有很多种,on.one.live.bind.delegate等等,接下来我们逐一来进行讲解. 本片文章中事件所带的为版本号,例:v1.7+为1 ...
- jQuery 中的事件绑定与取消绑定
1:在jQuery中使用bind方法进行事件的绑定,bind方法有两个参数,第一个参数是事件的类型例如click,change,keyup,keydown,blur,focus等.第二个参数是一个回调 ...
- js和jQuery中的事件绑定与普通事件
普通事件,是指直接对元素进行事件注册,然后触发 而事件绑定是将事件注册到元素上 两者区别就是在于普通事件不可以重复添加多个事件,若添加也会覆盖,只会触发其中一个事件(最后注册的那个) 而事件绑定是可以 ...
- jQuery中的事件绑定的几种方式
jQuery目前有on(),bind(),delegate(),live()四种绑定方式,但是随着版本的不断更新,有的方式也相应的被淘汰掉 [band()方式绑定] 3.0版本之前的绑定方式比较常用的 ...
- jQuery学习笔记(三)jQuery中的事件
目录 加载DOM 事件绑定 合成事件 事件冒泡 移除事件 一.加载DOM Javascript 与HTML之间的交互是通过用户操作浏览器页面引发的事件来处理的.jQuery提供了丰富的事件处理机制.从 ...
- jQuery中的事件与动画 (你的明天Via Via)
众所周知,页面在加载时,会触发load事件:当用户单击某个按钮时,会触发该按钮的click事件. 这些事件就像日常生活中,人们按下开关,灯就亮了(或者灭了),往游戏机里投入游戏币就可以启动游戏一样, ...
随机推荐
- noi 1996 登山
题目链接: http://noi.openjudge.cn/ch0206/1996/ LIS,LDS 正着做最长递增子序列,反着做最长递减子序列. http://paste.ubuntu.com/23 ...
- selenium操作浏览器cookie方法
/** * 操作浏览器的cookie */ @Test public void testCookie()throws Exception{ drive ...
- HDU 5775 Bubble Sort(冒泡排序)
p.MsoNormal { margin: 0pt; margin-bottom: .0001pt; text-align: justify; font-family: Calibri; font-s ...
- Page Visibility API(页面可见性)
页面可见性: 就是对于用户来说,页面是显示还是隐藏, 所谓显示的页面,就是我们正在看的页面:隐藏的页面,就是我们没有看的页面. 因为,我们一次可以打开好多标签页面来回切换着,始终只有一个页面在我们眼前 ...
- jquery validate 在ajax提交表单下的验证方法
$(function() { var method='${method }'; if(method == 'edit'){ url="${ctx}/commodity/typeReN ...
- stm32cube--串口
1.printf函数重定向 ①以stm32f103rct6的usart1为例,打开cube,配置好RCC和USART1,生成mdk程序. ②打开工程,在main.c中 /* USER CODE BEG ...
- Security » Authorization » 基于自定义策略的授权
Custom Policy-Based Authorization¶ 基于自定义策略的授权 98 of 108 people found this helpful Underneath the cov ...
- DbInitializer.cs初始化过程中context.entityName.Add()遇到的类型不匹配错误
用Asp.Net Core+EF Core建立一个测试项目过程中,使用DbInitializaer.cs进行数据库表的初始化工作,当项目测试运行时执行到context.实体名.Add()时,提示错误信 ...
- SpringMVC -- 梗概--贰
1.为什么要配置: mvc:annotation-driven 1>在springMVC的处理流程中,有两个重要组件:HandlerMapping和HandlerAdapter 分别负责解析Ha ...
- windows docker测试二 下载container
安装dockertoolbox,提供了一个docker的界面工具 Kitematic 和字符终端: Docker Quickstart Terminal (这里安装的Kitematic 是Alpha版 ...