jQuery live( type, fn ) 委派事件实现


Posted in Javascript onOctober 11, 2009

目前支持 click, dblclick, mousedown, mouseup, mousemove, mouseover, mouseout, keydown, keypress, keyup。
还不支持 blur, focus, mouseenter, mouseleave, change, submit
与bind()不同的是,live()一次只能绑定一个事件。
这个方法跟传统的bind很像,区别在于用live来绑定事件会给所有当前以及将来在页面上的元素绑定事件(使用委派的方式)。比如说,如果你给页面上所有的li用live绑定了click事件。那么当在以后增加一个li到这个页面时,对于这个新增加的li,其click事件依然可用。而无需重新给这种新增加的元素绑定事件。
.live()与流行的liveQuery插件很像,但有以下几个主要区别:
* .live 目前只支持所有事件的子集,支持列表参考上面的说明。
* .live 不支持liveQuery提供的“无事件”样式的回调函数。.live只能绑定事件处理函数。
* .live 没有"setup"和"cleanup"的过程。因为所有的事件是委派而不是直接绑定在元素上的。
要移除用live绑定的事件,请用die方法
返回值
jQuery
参数
type (String) : 一个或多个用空格分隔的事件名
fn (Function) : 欲绑定的事件处理函数
示例
点击生成的p依然据有同样的功能。
HTML 代码:
<p>Click me!</p>
jQuery 代码:

$("p").live("click", function(){ 
$(this).after("<p>Another paragraph!</p>"); 
});
Javascript 相关文章推荐
js获取div高度的代码
Aug 09 Javascript
javascript 拖放效果实现代码
Jan 22 Javascript
Ubuntu 11.10 安装Node.js的方法
Nov 30 Javascript
JS实现同时搜索百度和必应的方法
Jan 27 Javascript
jquery实现聚光灯效果的方法
Feb 06 Javascript
JavaScript实现自动变换表格边框颜色
May 08 Javascript
基于Vue实现tab栏切换内容不断实时刷新数据功能
Apr 13 Javascript
vue学习教程之带你一步步详细解析vue-cli
Dec 26 Javascript
基于AngularJS拖拽插件ngDraggable.js实现拖拽排序功能
Apr 02 Javascript
JavaScript内置对象之Array的使用小结
May 12 Javascript
Vue3新特性之在Composition API中使用CSS Modules
Jul 13 Javascript
在vue中使用jsonp进行跨域请求接口操作
Oct 29 Javascript
修改jQuery.Autocomplete插件 支持中文输入法 避免TAB、ENTER键失效、导致表单提交
Oct 11 #Javascript
JS模拟的QQ面板上的多级可展开的菜单
Oct 10 #Javascript
js css样式操作代码(批量操作)
Oct 09 #Javascript
防止动态加载JavaScript引起的内存泄漏问题
Oct 08 #Javascript
JavaScript delete 属性的使用
Oct 08 #Javascript
有效的捕获JavaScript焦点的方法小结
Oct 08 #Javascript
Javascript isArray 数组类型检测函数
Oct 08 #Javascript
You might like
php实现的SSO单点登录系统接入功能示例分析
2016/10/12 PHP
extjs 的权限问题 要求控制的对象是 菜单,按钮,URL
2010/03/09 Javascript
jQuery结合Json提交数据到Webservice,并接收从Webservice返回的Json数据
2011/02/18 Javascript
理清apply(),call()的区别和关系
2011/08/14 Javascript
jQuery EasyUI API 中文文档 - ComboGrid 组合表格
2011/10/13 Javascript
网页打开自动最大化的js代码
2012/08/22 Javascript
手写的一个兼容各种浏览器的javascript getStyle函数(获取元素的样式)
2014/06/06 Javascript
jQuery实现鼠标经过事件的延时处理效果
2020/08/20 Javascript
详解jQuery UI库中文本输入自动补全功能的用法
2016/04/23 Javascript
js监听input输入框值的实时变化实例
2017/01/26 Javascript
$.browser.msie 为空或不是对象问题的多种解决方法
2017/03/19 Javascript
使用nodejs爬取前程无忧前端技能排行
2017/05/06 NodeJs
Javascript 编码约定(编码规范)
2018/03/11 Javascript
vue返回上一页面时回到原先滚动的位置的方法
2018/12/20 Javascript
简单分析js中的this的原理
2019/08/31 Javascript
JavaScript实现图片伪异步上传过程解析
2020/04/10 Javascript
vue element-ui中table合计指定列求和实例
2020/11/02 Javascript
javascript中闭包closure的深入讲解
2021/03/03 Javascript
python概率计算器实例分析
2015/03/25 Python
Python中使用摄像头实现简单的延时摄影技术
2015/03/27 Python
使用Python脚本来控制Windows Azure的简单教程
2015/04/16 Python
在Python中使用判断语句和循环的教程
2015/04/25 Python
浅谈Python中的闭包
2015/07/08 Python
Python数据结构之栈、队列的实现代码分享
2017/12/04 Python
解决Pycharm中import时无法识别自己写的程序方法
2018/05/18 Python
python实现NB-IoT模块远程控制
2018/06/20 Python
使用PM2+nginx部署python项目的方法示例
2018/11/07 Python
使用python实现CGI环境搭建过程解析
2020/04/28 Python
详解用 python-docx 创建浮动图片
2021/01/24 Python
精致的手工皮鞋:Shoe Embassy
2019/11/08 全球购物
如何高效率的查找一个月以内的数据
2012/04/15 面试题
如何撰写岗位职责
2014/02/01 职场文书
2015年全国爱眼日活动方案
2015/05/05 职场文书
2015年乡镇科普工作总结
2015/05/13 职场文书
班主任开场白
2015/06/01 职场文书
Python开发简易五子棋小游戏
2022/05/02 Python