位置: 编程技术 - 正文

浅谈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)

  • 环境保护税的应税污染物有哪些
  • 收到失业保险稳岗补贴会计分录
  • 什么是清算机构的资产
  • 专用发票抬头一定要打完整吗
  • 企业长期贷款具备什么条件
  • 间接费用是指
  • 退还增值税留抵税额是什么政策
  • 小规模纳税人不允许开具零税率发票
  • 个人独资企业改为有限公司
  • 增值税普通发票需要交税吗
  • 增值税专票给客户的是第几联
  • 增值税季度报税
  • 旅行社代订机票发票报销
  • 如何查询发票是否验旧
  • 上月留抵的增值税在哪查询
  • 苹果客服人工24小时
  • 处理废料的会计分录
  • ie浏览器进程
  • 代金券消费怎么做分录
  • window显示我的电脑
  • SchSvr.exe - SchSvr是什么进程 有什么作用
  • threejs环境搭建
  • Chon湖上空的低空云,苏格兰特罗萨克斯 (© Alistair Dick/Alamy)
  • PHP:mcrypt_cbc()的用法_Mcrypt函数
  • 没有发票的成本怎么算
  • 企业迁址如何办理手续
  • TypeError: Cannot read properties of null (reading ‘insertBefore‘) vue项目报错
  • 布拉格下雪
  • php引用传值
  • 接受捐赠固定资产的改建支出
  • 制造业企业资金如何循环周转
  • 收到销售方的负债怎么办
  • discuz 移动端
  • 银行代发工资当天改工资卡来得及吗
  • 用python写
  • 建筑工程价款结算
  • 设计服务的成本票可以暂估吗
  • 企业商业负债包括哪些
  • 员工垫付公司的保险费
  • 怎么用java写代码
  • 零税率与免税有何区别
  • 金蝶标准版怎么查应收应付款
  • access数据库丢失原因
  • 坏账准备的账务处理T型
  • 贷款利息收入如何核算
  • 电子商业承兑会不会拿不到钱
  • 账本更正方法
  • 本年利润是不是未分配利润
  • 没计提的税费怎么处理
  • 未确认融资费用计算公式
  • 受托开发软件一般做什么
  • 资产负债表的编制依据是会计恒等式
  • linux命令实现
  • win10 bios模式
  • xp系统没有鼠标自己乱跳
  • 企业级路由器和普通路由器区别
  • linux ...
  • centos wi-fi
  • 电脑windowxp系统重装
  • 让你的好朋友评价你图片
  • 进程dwm
  • w7打穿越火线
  • linux生成文件
  • centos6.6
  • linux cp命令怎么用
  • windows7如何启动任务管理器
  • win8 开始
  • 如果打招呼了不理是什么原因
  • js创建类对象的方法
  • 浅谈jquery中ajax跨域提交的时候会有2次请求的问题
  • 用户dsn添加
  • jquery定位
  • JavaScript电子时钟倒计时第二款
  • javascript定律
  • Android 仿 iphone 自定义滚动选择器
  • 丹麦个人所得税税率表
  • 企业年金需要个人财产申报
  • 地税客服电话
  • 国际税务处岗位职责
  • 成都交房需要交什么费用
  • 免责声明:网站部分图片文字素材来源于网络,如有侵权,请及时告知,我们会第一时间删除,谢谢! 邮箱:opceo@qq.com

    鄂ICP备2023003026号

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

    友情链接: 武汉网站建设