位置: 编程技术 - 正文

浅谈jquery之on()绑定事件和off()解除绑定事件(jquery one())

编辑:rootadmin

推荐整理分享浅谈jquery之on()绑定事件和off()解除绑定事件(jquery one()),希望有所帮助,仅作参考,欢迎阅读内容。

文章相关热门搜索词:jqueryon方法,jquery on函数,jquery on函数,jqueryon方法,jquery on(),jquery on(),jquery on(),jquery中on的用法,内容如对您有帮助,希望把文章链接给更多的朋友!

off()函数用于移除元素上绑定的一个或多个事件的事件处理函数。

off()函数主要用于解除由on()函数绑定的事件处理函数。

该函数属于jQuery对象(实例)。

语法

jQuery 1.7 新增该函数。其主要有以下两种形式的用法:

用法一:

jQueryObject.off( [ events [, selector ] [, handler ] ] )

用法二:

jQueryObject.off( eventsMap [, selector ] )

参数

参数 描述 events 可选/String类型一个或多个用空格分隔的事件类型和可选的命名空间,例如"click"、"focus click"、"keydown.myPlugin"。 eventsMap Object类型一个Object对象,其每个属性对应事件类型和可选的命名空间(参数events),属性值对应绑定的事件处理函数(参数handler)。 selector 可选/String类型一个jQuery选择器,用于指定哪些后代元素可以触发绑定的事件。如果该参数为null或被省略,则表示当前元素自身绑定事件(实际触发者也可能是后代元素,只要事件流能到达当前元素即可)。 handler 可选/Function类型指定的事件处理函数。

off()函数将会移除当前匹配元素上为后代元素selector绑定的events事件的事件处理函数handler。

如果省略参数selector,则移除为任何元素绑定的事件处理函数。

参数selector必须与通过on()函数添加绑定时传入的选择器一致。

如果省略参数handler,则移除指定元素指定事件类型上绑定的所有事件处理函数。

如果省略了所有参数,则表示移除当前元素上为任何元素绑定的任何事件类型的任何事件处理函数。

返回值off()函数的返回值为jQuery类型,返回当前jQuery对象本身。

实际上,off()函数的参数全是筛选条件,只有匹配所有参数条件的事件处理函数才会被移除。参数越多,限定条件就越多,被移除的范围就越小。

off()方法的代码示例:

容易忽略的点:off所解除元素的绑定事件,其中选择器必须和on绑定事件时所用的选择器一致。

html代码

页面加载时执行的jquery代码

浅谈jquery之on()绑定事件和off()解除绑定事件(jquery one())

on()函数用于为指定元素的一个或多个事件绑定事件处理函数。

此外,你还可以额外传递给事件处理函数一些所需的数据。

从jQuery 1.7开始,on()函数提供了绑定事件处理程序所需的所有功能,用于统一取代以前的bind()、 delegate()、 live()等事件函数。

即使是执行on()函数之后新添加的元素,只要它符合条件,绑定的事件处理函数也对其有效。

此外,该函数可以为同一元素、同一事件类型绑定多个事件处理函数。触发事件时,jQuery会按照绑定的先后顺序依次执行绑定的事件处理函数。

要删除通过on()绑定的事件,请使用off()函数。如果要附加一个事件,只执行一次,然后删除自己,请使用one()函数。

该函数属于jQuery对象(实例)。

语法

jQuery 1.7 新增该函数。其主要有以下两种形式的用法:

用法一:

jQueryObject.on( events [, selector ] [, data ], handler )

用法二:

jQueryObject.on( eventsMap [, selector ] [, data ] )

参数

参数 描述 events String类型一个或多个用空格分隔的事件类型和可选的命名空间,例如"click"、"focus click"、"keydown.myPlugin"。 eventsMap Object类型一个Object对象,其每个属性对应事件类型和可选的命名空间(参数events),属性值对应绑定的事件处理函数(参数handler)。 selector 可选/String类型一个jQuery选择器,用于指定哪些后代元素可以触发绑定的事件。如果该参数为null或被省略,则表示当前元素自身绑定事件(实际触发者也可能是后代元素,只要事件流能到达当前元素即可)。 data 可选/任意类型触发事件时,需要通过event.data传递给事件处理函数的任意数据。 handler Function类型指定的事件处理函数。

关于参数events中可选的命名空间,请参考最下面的示例代码。

关于参数selector,你可以简单地理解为:如果该参数等于null或被省略,则为当前匹配元素绑定事件;否则就是为当前匹配元素的后代元素中符合selector选择器的元素绑定事件。

参数handler中的this指向当前匹配元素的后代元素中触发该事件的DOM元素。如果参数selector等于null或被省略,则this指向当前匹配元素(也就是该元素)。

on()还会为handler传入一个参数:表示当前事件的Event对象。

参数handler的返回值与DOM原生事件的处理函数返回值作用一致。例如"submit"(表单提交)事件的事件处理函数返回false,可以阻止表单的提交。

如果事件处理函数handler仅仅只为返回false值,可以直接将handler设为false。

返回值

on()函数的返回值为jQuery类型,返回当前jQuery对象本身。

重要说明:

on()函数并不是为当前jQuery对象匹配的元素绑定事件处理函数,而是为它们的后代元素中符合选择器selector参数的元素绑定事件处理函数。on()函数并不是直接为这些后代元素挨个绑定事件,而是委托给当前jQuery对象的匹配元素来处理。由于DOM 2级的事件流机制,当后代元素selector触发事件时,该事件会在事件冒泡中传递给其所有的祖辈元素,当事件流传递到当前匹配元素时,jQuery会判断是哪个后代元素触发了事件,如果该元素符合选择器selector,jQuery就会捕获该事件,从而执行绑定的事件处理函数。

标签: jquery one()

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

上一篇:jquery移除了live()、die(),新版事件绑定on()、off()的方法(jquery移出class)

下一篇:jQuery的ready方法实现原理分析(jquery(document).ready)

  • 工衣工帽清洗费税率是多少
  • 公车私车税收区别
  • 如何查询企业税务状态
  • 以前年度损益调整账务处理分录
  • 应收款和应付款对抵
  • 进项税额已抵扣转出会计分录
  • 银行日记账的登记实例图
  • 小规模购买金税盘分录
  • 利息股息红利所得
  • 有限责任公司减资的法律规定
  • 12月结账写本年累计吗
  • 交易性金融资产的交易费用计入哪里
  • 母公司派遣员工到子公司解散补偿金
  • 增值税专用发票的税率是多少啊
  • 买金税盘怎么做账,抵扣的时候
  • 当月税负率怎么算
  • 经营性租入的设备是资产吗
  • 公司零报税需要会计吗
  • 电话费发票个人抬头可以税前扣除
  • 公司购买电视
  • 代账代税与自行核算申报应从哪几个角度考虑
  • 红冲的普通发票要给对方吗
  • 上个月多计提的费用怎么调整
  • php 用户和密码
  • php ado
  • win10改头像怎么删除以前的头像
  • ubuntu20.04安装make
  • [Vue warn]: Error in created hook: “TypeError: Cannot read properties of undefined (reading ‘$on‘)“
  • php中数组的常用函数及用法
  • 收到社保稳岗补贴转入营业外收入要交企业所得税吧
  • java前后端加密解密请求
  • 前端 教程
  • 红冲上年度收入怎么做凭证
  • 深究Python中的asyncio库-线程同步
  • 哪些税费可以抵扣
  • 织梦怎么套模板
  • python天气数据的爬取与分析
  • c语言asc函数
  • mongodb使用案例
  • mongodb怎么导入文件
  • 库存商品余额在借方是什么意思
  • 地税发票丢失怎么办?
  • 不动产登记机构应当履行下列职责?
  • 火车退票费如何开票
  • 减免进项税的分录怎么做
  • 开发票,对方收取税点,如何计算?
  • 固定资产盘亏是什么意思
  • 收不回来的问题
  • 委托收款的业务场景有哪些
  • 房地产企业何时确认收入结转成本
  • 印花税的计税依据及税率
  • 防洪费的税率是多少
  • 物流公司的会计怎么样
  • 会计凭证发票粘贴
  • 总分类账建账顺序
  • 房地产企业以土地入股如何交纳企业所得税
  • 公司私营企业
  • win10 tab alt
  • macbookpro蓝牙找不到
  • 怎样打开进程管理器功能
  • 电脑重装系统win8
  • centos怎么安装软件包
  • win7系统玩暗黑2怎样全屏
  • windows xp功能介绍
  • w10系统如何
  • 电脑开机后出现win7画面后一直黑屏
  • win安装ie8
  • cocos2dx shader
  • nodejs libuv
  • python中flask模块
  • vue2.x
  • 前端头像裁剪
  • 不想让浏览器运行
  • Genymotion首次运行程序出现错误Installation error: INSTALL_FAILED_CPU_ABI_INCOMPATIBLE
  • 税务数字证书密码修改失败
  • 长春税务局电话举报
  • 青岛怎样网上交医保
  • 广州2021社保费
  • 税务上的关联企业指哪些
  • 财政部国家税务总局2021年40号
  • 免责声明:网站部分图片文字素材来源于网络,如有侵权,请及时告知,我们会第一时间删除,谢谢! 邮箱:opceo@qq.com

    鄂ICP备2023003026号

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

    友情链接: 武汉网站建设