JQuery live函数


Posted in Javascript onDecember 24, 2010

摘自 jQuery 1.4.1 中文参考:

事件委托

.live() 方法能对一个还没有添加进DOM的元素有效,是由于使用了事件委托:绑定在祖先元素上的事件处理函数可以对在后代上触发的事件作出回应。传递给 .live() 的事件处理函数不会绑定在元素上,而是把他作为一个特殊的事件处理函数,绑定在 DOM 树的根节点上。在我们的例子中,当点击新的元素后,会依次发生下列步骤:

  1. 生成一个click事件传递给 <div> 来处理
  2. 由于没有事件处理函数直接绑定在 <div> 上,所以事件冒泡到DOM树上
  3. 事件不断冒泡一直到DOM树的根节点,默认情况下上面绑定了这个特殊的事件处理函数。
  4. 执行由 .live() 绑定的特殊的 click 事件处理函数。
  5. 这个事件处理函数首先检测事件对象的 target 来确定是不是需要继续。这个测试是通过检测 $(event.target).closest('.clickme') 能否找到匹配的元素来实现的。
  6. 如果找到了匹配的元素,那么调用原始的事件处理函数。

由于只有在事件发生时才会在上面的第五步里做测试,因此在任何时候添加的元素都能够响应这个事件

Javascript 相关文章推荐
JQuery SELECT单选模拟jQuery.select.js
Nov 12 Javascript
js word表格动态添加代码
Jun 07 Javascript
javascript简易缓动插件(源码打包)
Feb 16 Javascript
JS实现随机数生成算法示例代码
Aug 08 Javascript
JavaScript中实现无缝滚动、分享到侧边栏实例代码
Apr 06 Javascript
Webpack执行命令参数详解
Jun 17 Javascript
在 webpack 中使用 ECharts的实例详解
Feb 05 Javascript
解决vue-cli3 使用子目录部署问题
Jul 19 Javascript
jQuery实现轮播图及其原理详解
Apr 12 jQuery
layui table数据修改的回显方法
Sep 04 Javascript
使用vscode快速建立vue模板过程详解
Oct 10 Javascript
解决vue动态路由异步加载import组件,加载不到module的问题
Jul 26 Javascript
jquery 单击li防止重复加载的实现代码
Dec 24 #Javascript
基于jquery的关于动态创建DOM元素的问题
Dec 24 #Javascript
在JavaScript中获取请求的URL参数
Dec 22 #Javascript
基于Jquery的表格隔行换色,移动换色,点击换色插件
Dec 22 #Javascript
jQuery Clone Bug解决代码
Dec 22 #Javascript
修改jquery.lazyload.js实现页面延迟载入
Dec 22 #Javascript
jquery插件 autoComboBox 下拉框
Dec 22 #Javascript
You might like
咖啡豆要不要放冰箱的原因
2021/03/04 冲泡冲煮
很好用的PHP数据库类
2009/05/27 PHP
php 中文字符入库或显示乱码问题的解决方法
2010/04/12 PHP
curl不使用文件存取cookie php使用curl获取cookie示例
2014/01/26 PHP
windwos下使用php连接oracle数据库的过程分享
2014/05/26 PHP
javascript写的一个链表实现代码
2009/10/25 Javascript
Jquery 切换不同图片示例代码
2013/12/05 Javascript
Jquery each方法跳出循环,并获取返回值(实例讲解)
2013/12/12 Javascript
Ajax提交与传统表单提交的区别说明
2014/02/07 Javascript
解析JavaScript面向对象概念中的Object类型与作用域
2016/05/10 Javascript
详解js界面跳转与值传递
2016/11/22 Javascript
react开发教程之React 组件之间的通信方式
2017/08/12 Javascript
js解决软键盘遮挡输入框的问题分享
2017/12/19 Javascript
webpack 样式加载的实现原理
2018/06/12 Javascript
JS实现用特殊符号替换字符串的中间部分区域的实例代码
2018/07/24 Javascript
vue多级复杂列表展开/折叠及全选/分组全选实现
2018/11/05 Javascript
JavaScript canvas实现跟随鼠标移动小球
2021/02/09 Javascript
[01:05:59]Mineski vs Secret 2019国际邀请赛淘汰赛 败者组 BO3 第二场 8.22
2019/09/05 DOTA
复制粘贴功能的Python程序
2008/04/04 Python
Python中for循环详解
2014/01/17 Python
Flask框架单例模式实现方法详解
2019/07/31 Python
Python处理PDF与CDF实例
2020/02/26 Python
python中adb有什么功能
2020/06/07 Python
python dict乱码如何解决
2020/06/07 Python
Python数据可视化实现多种图例代码详解
2020/07/14 Python
Python中Pyspider爬虫框架的基本使用详解
2021/01/27 Python
css3模拟jq点击事件的实例代码
2017/07/06 HTML / CSS
Ralph Lauren英国官方网站:Ralph Lauren UK
2018/04/03 全球购物
英国版MAC彩妆品牌:Illamasqua
2018/04/18 全球购物
美国折扣地毯销售网站:Rugs.com
2020/03/27 全球购物
学生自我评价范文
2014/02/02 职场文书
工作经常出错的检讨书
2014/09/13 职场文书
常务副县长“四风”个人对照检查材料思想汇报
2014/10/02 职场文书
创建文明城市倡议书
2015/04/28 职场文书
教师个人工作总结范文2015
2015/10/14 职场文书