位置: 编程技术 - 正文

jQuery中bind(),live(),delegate(),on()绑定事件方法实例详解

编辑:rootadmin

推荐整理分享jQuery中bind(),live(),delegate(),on()绑定事件方法实例详解,希望有所帮助,仅作参考,欢迎阅读内容。

文章相关热门搜索词:,内容如对您有帮助,希望把文章链接给更多的朋友!

本文实例分析了jQuery中bind(),live(),delegate(),on()绑定事件方法。分享给大家供大家参考,具体如下:

前言

因为项目中经常会有利用jquery操作dom元素的增删操作,所以会涉及到dom元素的绑定事件方式,简单的归纳一下bind,live,delegate,on的区别,以便以后查阅,也希望该文章日后能帮助到各位朋友,文中如有不当之处,还望各位指正,话不多说,直接进入正题。

一、bind()

简要描述

bind()向匹配元素添加一个或多个事件处理器。

使用方式event:必需项;添加到元素的一个或多个事件,例如 click,dblclick等;

单事件处理:例如多事件处理:1.利用空格分隔多事件,例如2.利用大括号灵活定义多事件,例如3.空格相隔方式:绑定较为死板,不能给事件单独绑定函数,适合处理多个事件调用同一函数情况;

大括号替代方式:绑定较为灵活,可以给事件单独绑定函数;

data:可选;需要传递的参数;function:必需;当绑定事件发生时,需要执行的函数;

举例说明

适用Jquery版本

适用所有版本,但是根据官网解释,自从jquery1.7版本以后bind()函数推荐用on()来代替。

二、live()

简要描述

live() 向当前或未来的匹配元素添加一个或多个事件处理器;

使用方式event:必需项;添加到元素的一个或多个事件,例如 click,dblclick等;

单事件处理:例如多事件处理:1.利用空格分隔多事件,例如2.利用大括号灵活定义多事件,例如3.空格相隔方式:绑定较为死板,不能给事件单独绑定函数,适合处理多个事件调用同一函数情况;

大括号替代方式:绑定较为灵活,可以给事件单独绑定函数;

data:可选;需要传递的参数;function:必需;当绑定事件发生时,需要执行的函数;

举例说明

适用Jquery版本

jquery1.9版本以下支持,jquery1.9及其以上版本删除了此方法,jquery1.9以上版本用on()方法来代替。

三、delegate()

简要描述

delegate() 为指定的元素(被选元素的子元素)添加一个或多个事件处理程序,并规定当这些事件发生时运行的函数。使用 delegate() 方法的事件处理程序适用于当前或未来的元素(比如由脚本创建的新元素)。

使用方式childSelector: 必需项;需要添加事件处理程序的元素,一般为selector的子元素;event:必需项;添加到元素的一个或多个事件,例如 click,dblclick等;

jQuery中bind(),live(),delegate(),on()绑定事件方法实例详解

单事件处理:例如多事件处理:1.利用空格分隔多事件,例如 2.利用大括号灵活定义多事件,例如 3.空格相隔方式:绑定较为死板,不能给事件单独绑定函数,适合处理多个事件调用同一函数情况;

大括号替代方式:绑定较为灵活,可以给事件单独绑定函数;

data:可选;需要传递的参数;function:必需;当绑定事件发生时,需要执行的函数;

举例说明

适用Jquery版本

jquery1.4.2及其以上版本;

四、on()

简要描述

on() 为指定的元素,添加一个或多个事件处理程序,并规定当这些事件发生时运行的函数。使用 on() 方法的事件处理程序适用于当前或未来的元素(比如由脚本创建的新元素)。

使用方式event:必需项;添加到元素的一个或多个事件,例如 click,dblclick等;

单事件处理:例如多事件处理:1.利用空格分隔多事件,例如2.利用大括号灵活定义多事件,例如3.空格相隔方式:绑定较为死板,不能给事件单独绑定函数,适合处理多个事件调用同一函数情况;

大括号替代方式:绑定较为灵活,可以给事件单独绑定函数;

childSelector: 可选;需要添加事件处理程序的元素,一般为selector的子元素; data:可选;需要传递的参数;function:必需;当绑定事件发生时,需要执行的函数;

举例说明

适用Jquery版本

jquery1.7及其以上版本;jquery1.7版本出现之后用于替代bind(),live()绑定事件方式;

五、四种方式的异同和优缺点

相同点:

1.都支持单元素多事件的绑定;空格相隔方式或者大括号替代方式;2.均是通过事件冒泡方式,将事件传递到document进行事件的响应;

比较和联系:

1.bind()函数只能针对已经存在的元素进行事件的设置;但是live(),on(),delegate()均支持未来新添加元素的事件设置;演示代码如下:

2.bind()函数在jquery1.7版本以前比较受推崇,1.7版本出来之后,官方已经不推荐用bind(),替代函数为on(),这也是1.7版本新添加的函数,同样,可以用来代替live()函数,live()函数在1.9版本已经删除;

3.live()函数和delegate()函数两者类似,但是live()函数在执行速度,灵活性和CSS选择器支持方面较delegate()差些,想了解具体情况,请参考这篇《jQuery中的.bind()、.live()和.delegate()之间区别分析》

4.bind()支持Jquery所有版本;live()支持jquery1.8-;delegate()支持jquery1.4.2+;on()支持jquery1.7+;

六、总结

如果项目中引用jquery版本为低版本,推荐用delegate(),高版本jquery可以使用on()来代替,以上仅为个人看法,如有不同想法,欢迎拍砖交流。

更多关于jQuery事件相关内容感兴趣的读者可查看本站专题:《jQuery常见事件用法与技巧总结》

希望本文所述对大家jQuery程序设计有所帮助。

jQuery绑定事件监听bind和移除事件监听unbind用法实例详解 本文实例讲述了jQuery绑定事件监听bind和移除事件监听unbind用法。分享给大家供大家参考,具体如下:这里分别采用后bind(eventType,[data],Listener)//data为可选

jQuery unbind()方法实例详解 本文实例讲述了jQueryunbind()方法使用方法。分享给大家供大家参考,具体如下:jQuery中的unbind()方法是bind()方法的反向操作,从每一个匹配的元素中删除

在其他地方你学不到的jQuery小贴士和技巧(欢迎收藏) 下面小编给大家整理了8个技巧对程序员来说非常的有帮助,具体如下所示:1)禁用鼠标右键单击jQuery程序员可以使用此代码在网页上禁用鼠标右键点击

标签: jQuery中bind(),live(),delegate(),on()绑定事件方法实例详解

本文链接地址:https://www.jiuchutong.com/biancheng/380643.html 转载请保留说明!

上一篇:jQuery事件绑定用法详解(附bind和live的区别)(jquery常用的事件绑定函数有哪些)

下一篇:jQuery绑定事件监听bind和移除事件监听unbind用法实例详解(jquery绑定事件和移除事件)

  • 企业所得税怎么征收几个点
  • 什么是税收滞纳金请举例说明
  • 行政事业单位住房基金
  • 进项税额转出会影响利润吗
  • 反结账只能反结上月的账吗
  • 房地产常用的付款方式有哪三种
  • 财政补贴的概念是什么?其性质是什么?
  • 政府会计制度中累计盈余怎么计算
  • 物业公司预收款怎么做账
  • 基建项目待摊投资
  • 个体户需要交税吗要交多少
  • 税控技术服务费计入什么科目
  • 小规模纳税人没有成本票怎么做账
  • 公司增值税发票有限额吗
  • 可以抵扣的增值税计入什么科目
  • 应交增值税出口退税科目怎么结平
  • 一卡通充值计入什么费
  • 房屋使用权转让合法吗
  • 交换房产土地如何交税
  • 现金支付给个人
  • 外汇汇兑损益怎么做账
  • 账套更改
  • 高新技术的研发收入是多少才可以提高
  • 带息票据贴现如何计算
  • paytime.exe - paytime是什么进程 有什么用
  • php使用内置函数的过程
  • php技术实现加载的过程
  • vue 移动端
  • 债券投资账务处理例题
  • 员工购买住房公积金申请
  • 外商投资企业 外资企业
  • 电子税务局已申报信息查询
  • Delete `␍` 最简单最有效的解决方法和解释(VScode)
  • pytorch训练yolov3
  • google map
  • web 前端
  • sysstat命令
  • openssl 加密套件
  • php判断文件是否存在的函数
  • 事业单位收到的罚款收入应纳入
  • mysql的备份方式
  • java中空字符怎么表示
  • 资质使用费怎么收
  • mysql常见报错
  • 进口消费税应该记到什么科目
  • 个体工商户免费开票额度
  • 什么叫做有限循环小数
  • 职工福利按工资的实付还是应付提取
  • 主营业务成本借贷方向增减
  • 投资性房地产成本法账务处理
  • 暂估入库没有票怎么冲掉
  • 现金短缺与溢余的区别
  • 直接私募如何纳税
  • 印花税的计入科目有哪些
  • 次年发上年年终奖
  • 研发一个月多少钱
  • 建筑业企业承包资质类别包括
  • 企业以前年度亏损未弥补完
  • 厂房拆了建住宅可以么
  • mysql模糊查询like多个条件
  • innodb_flush_method取值方法(实例讲解)
  • ubuntu屏幕截图快捷键
  • assoc.exe
  • 在windows中用于显示正在运行的程序名称的栏称为
  • Win7系统启动密码
  • win10的qq
  • lsm.exe是什么程序
  • win8 开机
  • linux系统安装软件教程
  • javascript数据结构与算法第三版
  • 自定义控件英文
  • android自定义属性详解
  • javascript基础笔记
  • 如何控制孩子的手机使用时间
  • call和apply用法
  • jQuery UI Bootstrap是什么?
  • android实现侧边栏
  • 律师提成怎么计算出来的
  • 税控盘开电子发票流程
  • 西安市人力资源和社会保障局关于2020年
  • 免责声明:网站部分图片文字素材来源于网络,如有侵权,请及时告知,我们会第一时间删除,谢谢! 邮箱:opceo@qq.com

    鄂ICP备2023003026号

    网站地图: 企业信息 工商信息 财税知识 网络常识 编程技术

    友情链接: 武汉网站建设