jquery绑定元素id事件_jQuery绑定事件与事件代理

这篇博客探讨了在JavaScript中使用jQuery进行事件绑定的重要性,特别是针对动态新增DOM元素的场景。文中指出直接绑定事件可能导致新增元素无法响应,推荐使用事件代理来解决这个问题。同时,还介绍了如何使用`.off()`方法移除已绑定的事件处理函数,确保代码的整洁和高效。
摘要由CSDN通过智能技术生成

第一步,引用jQuery!

第一步,引用jQuery!

第一步,引用jQuery!

.on()

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

events:一个或多个空格分隔的事件类型和可选的命名空间,或仅仅是命名空间,比如"click", "keydown.myPlugin", 或者 ".myPlugin"
selector:一个选择器字符串,用于过滤出被选中的元素中能触发事件的后代元素。如果选择器是 null 或者忽略了该选择器,那么被选中的元素总是能触发事件
data:当一个事件被触发时,要传递给事件处理函数的event.data
handler(eventObject):事件被触发时,执行的函数。若该函数只是要执行return false的话,那么该参数位置可以直接简写成 false

7a858e710e0cf755fd5f2ee44678cf81.png

绑定事件:

7affd31df2ad4ba2382aad476ea4962f.png

新增元素

0acd222cda52271fc637f7227963fddf.png

查看绑定事件对新增元素是否生效

4dd68a8271a0819696be52a87abf3fb8.png

可以清楚的看到我们直接给li添加事件,会导致后来新增的DOM li 点击没有效果,这个和javaScript的点击事件和事件代理是一样,可以使用事件代理来处理这个点击事件

5e8486967ff887efd19b7dd153329f23.png

.off()

.off( events [, selector ] [, handler ] )移除一个事件处理函数

$('.box li').off('click')
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值