jQuery中bind,live,delegate与one方法的用法及区别解析


Posted in Javascript onDecember 30, 2013

bind( )方法用于将一个处理程序附加到每个匹配元素的事件上并返回jQuery对象。

.bind(eventType[, evnetData], Handler(eventObject))

其中,参数eventType是一个字符串,包含一个或多个javaScript事件类型,例如click,submit或自定义事件的名称,指定多个事件类型时用空格分隔各个类型;eventData为Map类型,给出要传递给事件处理程序的数据,handler指定触发该事件时要执行的函数,eventObject表示事件对象。

.bind()方法将事件处理程序handler附加到匹配元素集合中的每个元素的eventType事件上,如果需要,还可以向事件处理程序传递数据。

live( )方法将一个事件处理程序附加到与当前选择器匹配的所有元素(包含现有的或将来添加的)的指定事件上并返回jQuery对象。

.live(eventType,[eventData],handler)

其中,参数eventType是一个字符串,包含一个或多个javaScript事件类型,例如click,keydown或自定义事件的名称,eventData是可选参数,为Map类型,给出要传递给事件处理程序的数据,该参数是在jQuery1.4中添加的;handler是一个函数,当触发该事件时将执行这些函数

.live()方法将事件处理程序handler附加到每个匹配元素(包含当前存在的和将来添加的)的eventType事件上,必要时还可以使用参加eventData向事件处理程序传递数据。

.live()方法是基本的.bind()方法的一个变形,后者可以将事件处理程序附加到元素·,当调用.bind()时,jQuery对象匹配的元素将被附加上事件处理程序,但以后添加的元素并不会被附加该事件处理程序,因此,还需要对这些元素再次调用.bind()方法。

.one()方法将事件处理程序附加到匹配元素的指定事件并返回jQuery对象。所附加的事件处理程序最多只能执行一次。

.one(eventType,[eventData],handler(eventObject))

其中,参数eventType是一个字符串,包含一个或多个javaScript事件类型,例如click,submit或自定义事件的名称,指定多个事件类型时用空格分隔各个类型;eventData为Map类型,给出要传递给事件处理程序的数据,handler指定触发该事件时要执行的函数,eventObject表示事件对象。

.one()方法与.bind()类似,所不同的是,使用.one()绑定的事件处理程序在执行一次之后将自动取消绑定。

.delegate()方法基于一组特定的根元素将处理程序附加到匹配选择器的所有元素(现有的或将来的)的一个或多个事件上。

.delegate(selector,eventType[,eventData],handler)

其中,参数 selector是一个选择器,用于筛选触发事件的元素;eventType是一个字符串,指定一个或多个JavaScript事件类型(多个事件用空格分隔),例如click,keydown或自定义事件名称;eventData为映射类型,表示要传递给事件处理程序的数据;handler表示触发该事件时执行的函数。

.delegate()与.live()类似,可将每个事件的绑定委托给指定的DOM元素。

Javascript 相关文章推荐
如何实现浏览器上的右键菜单
Jul 10 Javascript
如何做到打开一个页面,过几分钟自动转到另一页面
Apr 20 Javascript
JQUERY 设置SELECT选中项代码
Feb 07 Javascript
jQuery 浮动导航菜单适合购物商品类型的网站
Sep 09 Javascript
jQuery插件jPaginate实现无刷新分页
May 04 Javascript
Jquery实现瀑布流布局(备有详细注释)
Jul 31 Javascript
AngularJS使用angular.bootstrap完成模块手动加载的方法分析
Jan 19 Javascript
使用JS在浏览器中判断当前网络连接状态的几种方法
May 05 Javascript
解决使用Vue.js显示数据的时,页面闪现原始代码的问题
Feb 11 Javascript
通过封装scroll.js 获取滚动条的值
Jul 13 Javascript
ES6知识点整理之函数数组参数的默认值及其解构应用示例
Apr 17 Javascript
package.json中homepage属性的作用详解
Mar 11 Javascript
解析jQuery的三种bind/One/Live事件绑定使用方法
Dec 30 #Javascript
jQuery中.live()方法的用法深入解析
Dec 30 #Javascript
Javasipt:操作radio标签详解
Dec 30 #Javascript
js获取select标签的值且兼容IE与firefox
Dec 30 #Javascript
jquery获得keycode的示例代码
Dec 30 #Javascript
原生javaScript做得动态表格(注释写的很清楚)
Dec 29 #Javascript
JS对象转换为Jquery对象实现代码
Dec 29 #Javascript
You might like
咖啡常见的种类
2021/03/03 新手入门
PHP 第三节 变量介绍
2012/04/28 PHP
php addslashes 利用递归实现使用反斜线引用字符串
2013/08/05 PHP
php利用smtp类实现电子邮件发送
2015/10/30 PHP
php+ajax实现异步上传文件或图片功能
2017/07/18 PHP
PHP经典设计模式之依赖注入定义与用法详解
2019/05/21 PHP
为JavaScript添加重载函数的辅助方法
2010/07/04 Javascript
Javascript技巧之不要用for in语句对数组进行遍历
2010/10/20 Javascript
javascript的字符串按引用复制和传递,按值来比较介绍与应用
2012/12/28 Javascript
js字符串截取函数substr substring slice使用对比
2013/11/27 Javascript
JS去除字符串两端空格的简单实例
2013/12/27 Javascript
扩展jQuery对象时如何扩展成员变量具体怎么实现
2014/04/25 Javascript
jQuery淡入淡出元素让其效果更为生动
2014/09/01 Javascript
js老生常谈之this,constructor ,prototype全面解析
2016/04/05 Javascript
javascript判断元素存在和判断元素存在于实时的dom中的方法
2017/01/17 Javascript
JavaScript数据结构之二叉树的遍历算法示例
2017/04/13 Javascript
ES6 javascript中class静态方法、属性与实例属性用法示例
2017/10/30 Javascript
基于$.ajax()方法从服务器获取json数据的几种方式总结
2018/01/31 Javascript
9102年webpack4搭建vue项目的方法步骤
2019/02/20 Javascript
微信小程序学习总结(一)项目创建与目录结构分析
2020/06/04 Javascript
10种检测Python程序运行时间、CPU和内存占用的方法
2015/04/01 Python
Python栈类实例分析
2015/06/15 Python
Python实现快速多线程ping的方法
2015/07/15 Python
Python实现八大排序算法
2016/08/13 Python
Python使用requests发送POST请求实例代码
2018/01/25 Python
基于Python安装pyecharts所遇的问题及解决方法
2019/08/12 Python
使用Python+selenium实现第一个自动化测试脚本
2020/03/17 Python
John Hardy官方网站:手工设计首饰的奢侈品牌
2017/07/05 全球购物
车库门开启器、遥控器和零件:Chamberlain
2019/04/09 全球购物
怎么样写好简历中的自我评价
2013/10/25 职场文书
大学生就业自我鉴定
2013/10/26 职场文书
毕业生文员求职信
2013/11/03 职场文书
大学生的网络创业计划书
2013/12/26 职场文书
组织生活会表态发言材料
2014/10/17 职场文书
详解TS数字分隔符和更严格的类属性检查
2021/05/06 Javascript
vue组件vue-esign实现电子签名
2022/04/21 Vue.js