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 相关文章推荐
extjs DataReader、JsonReader、XmlReader的构造方法
Nov 07 Javascript
使用jQuery插件创建常规模态窗口登陆效果
Aug 23 Javascript
多种方法实现360浏览器下禁止自动填写用户名密码
Jun 16 Javascript
JavaScript字符串对象charAt方法入门实例(用于取得指定位置的字符)
Oct 17 Javascript
Javascript常用小技巧汇总
Jun 24 Javascript
分享JavaScript与Java中MD5使用两个例子
Dec 23 Javascript
浅谈jQuery hover(over, out)事件函数
Dec 03 Javascript
JavaScript数据结构之链表的实现
Mar 19 Javascript
EasyUI在Panel上动态添加LinkButton按钮
Aug 11 Javascript
jQuery.parseJSON()函数详解
Feb 28 jQuery
vue通过v-html指令渲染的富文本无法修改样式的解决方案
May 20 Javascript
解决vue页面刷新,数据丢失的问题
Nov 24 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常用代码
2006/11/23 PHP
允许phpmyadmin空密码登录的配置方法
2011/05/29 PHP
php array的学习笔记
2012/05/16 PHP
php获得文件大小和文件创建时间的方法
2015/03/13 PHP
PHP使用Pear发送邮件(Windows环境)
2016/01/05 PHP
Yii框架实现的验证码、登录及退出功能示例
2017/05/20 PHP
详解JavaScript中undefined与null的区别
2014/03/29 Javascript
Node.js中的缓冲与流模块详细介绍
2015/02/11 Javascript
如何使用jquery实现文字上下滚动效果
2016/10/12 Javascript
js通过classname来获取元素的方法
2016/11/24 Javascript
解决Jquery下拉框数据动态获取的问题
2018/01/25 jQuery
vue-infinite-loading2.0 中文文档详解
2018/04/08 Javascript
JS实现区分中英文并统计字符个数的方法示例
2018/06/09 Javascript
微信小程序控制台提示warning:Now you can provide attr "wx:key" for a "wx:for" to improve performance解决方法
2019/02/21 Javascript
vue 中Virtual Dom被创建的方法
2019/04/15 Javascript
解决使用layui的时候form表单中的select等不能渲染的问题
2019/09/18 Javascript
js实现拖动缓动效果
2020/01/13 Javascript
基于Element的组件改造的树形选择器(树形下拉框)
2020/02/27 Javascript
kNN算法python实现和简单数字识别的方法
2014/11/18 Python
Python实现的多叉树寻找最短路径算法示例
2018/07/30 Python
用Python将mysql数据导出成json的方法
2018/08/21 Python
Python 利用scrapy爬虫通过短短50行代码下载整站短视频
2018/10/29 Python
解决python文件双击运行秒退的问题
2019/06/24 Python
python查看数据类型的方法
2019/10/12 Python
Pytorch Tensor 输出为txt和mat格式方式
2020/01/03 Python
python实现拼图小游戏
2020/02/22 Python
Keras自动下载的数据集/模型存放位置介绍
2020/06/19 Python
python两种注释用法的示例
2020/10/09 Python
网络编程中设计并发服务器,使用多进程与多线程,请问有什么区别?
2016/03/27 面试题
大学生个人事迹材料
2014/01/21 职场文书
学习雷锋做美德少年寄语大全
2014/04/09 职场文书
湖南省党的群众路线教育实践活动总结会议新闻稿
2014/10/21 职场文书
专业技术职务聘任证明
2015/03/02 职场文书
原生JS中应该禁止出现的写法
2021/05/05 Javascript
python基于tkinter实现gif录屏功能
2021/05/19 Python
Python绘制散点图之可视化神器pyecharts
2022/07/07 Python