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 相关文章推荐
JQuery从头学起第三讲
Jul 06 Javascript
js 中{},[]中括号,大括号使用详解
May 12 Javascript
模拟多级复选框效果的jquery代码
Aug 13 Javascript
js阻止冒泡及jquery阻止事件冒泡示例介绍
Nov 19 Javascript
基于JavaScript实现Tab选项卡切换效果
Nov 24 Javascript
详解微信小程序 通过控制CSS实现view隐藏与显示
May 24 Javascript
vue实现长图垂直居上 vue实现短图垂直居中
Oct 18 Javascript
小程序实现留言板
Nov 02 Javascript
微信小程序实现点赞、取消点赞功能
Nov 02 Javascript
Next.js项目实战踩坑指南(笔记)
Nov 29 Javascript
JS实现的小火箭发射动画效果示例
Dec 08 Javascript
vue 递归组件的简单使用示例
Jan 14 Vue.js
解析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
php导入excel文件到mysql数据库的方法
2015/01/14 PHP
从wamp到xampp的升级之路
2015/04/08 PHP
php微信公众平台开发之获取用户基本信息
2015/08/17 PHP
php简单实现sql防注入的方法
2016/04/22 PHP
通过js简单实现将一个文本内容转译成加密文本
2013/10/22 Javascript
js 动态修改css文件用到了cssRule
2014/08/20 Javascript
javascript变量声明实例分析
2015/04/25 Javascript
jQuery插件Validate实现自定义表单验证
2016/01/18 Javascript
JavaScript中数组常见操作技巧
2017/09/01 Javascript
javascript代码优化的8点总结
2018/01/29 Javascript
详解mpvue开发小程序小总结
2018/07/25 Javascript
vue基于element-ui的三级CheckBox复选框功能的实现代码
2018/10/15 Javascript
在Node.js下运用MQTT协议实现即时通讯及离线推送的方法
2019/01/24 Javascript
JavaScript自定义超时API代码实例
2020/04/30 Javascript
[03:38]2014DOTA2西雅图国际邀请赛 VG战队巡礼
2014/07/07 DOTA
python使用any判断一个对象是否为空的方法
2014/11/19 Python
Python对CSV、Excel、txt、dat文件的处理
2018/09/18 Python
python取数作为临时极大值(极小值)的方法
2018/10/15 Python
Python实现删除排序数组中重复项的两种方法示例
2019/01/31 Python
Python对ElasticSearch获取数据及操作
2019/04/24 Python
python实现根据文件格式分类
2019/10/31 Python
python如何实现单链表的反转
2020/02/10 Python
python编写俄罗斯方块
2020/03/13 Python
jupyter notebook 恢复误删单元格或者历史代码的实现
2020/04/17 Python
pytorch 查看cuda 版本方式
2020/06/23 Python
使用Python实现音频双通道分离
2020/12/25 Python
亚洲最大的运动鞋寄售店:KicksCrew
2020/11/26 全球购物
*p++ 自增p 还是p所指向的变量
2016/07/16 面试题
数控技术学生的自我评价
2014/02/15 职场文书
房地产促销活动方案
2014/03/01 职场文书
幼儿园大班评语大全
2014/04/17 职场文书
婚礼父母答谢词
2015/01/04 职场文书
怎样评估创业计划书是否有可行性?
2019/08/07 职场文书
导游词之青岛崂山
2019/12/27 职场文书
利用Python第三方库实现预测NBA比赛结果
2021/06/21 Python
MySQL 数据库 增删查改、克隆、外键 等操作
2022/05/11 MySQL