jquery 如何获取新生成iframe内的点击事件_彻底弄懂jquery事件委托的用法

"事件委托是一种利用事件冒泡原理,将事件处理程序绑定到父元素而不是所有子元素的技术。这样可以提高性能,特别是在子元素众多或动态生成时。jQuery的.on()方法支持事件委托,例如`$("ul").on("click", "li", function() {...}
摘要由CSDN通过智能技术生成

jquery总结起来就是对dom、事件处理、ajax的简化,今天给大家介绍下jquery中事件处理中的委托机制。

什么是事件委托?
事件委托其实利用了事件冒泡机制(当事件发生后,这个事件就要开始传播(从里到外或者从外向里),简单点来说,比如我们常见的onclick、keydown、keyup等一系列的用户操作绑定给其他元素来做(本应该由这个元素来操作的),这就是事件委托。

b03f445eec1dcd4857b18cb617cabe2d.png

为什么不直接操作元素,而用事件委托来操作元素呢?

一:性能原因
如果一个父级元素里子元素太多的时候,为每个子元素进行独立绑定事件处理的话,无疑是浪费了很大的页面性能。所以利用委托机制来处理是最佳的选择。
二:为动态生成的元素,在不可预见的页面,比如我们常见的点击生成更多的页面,这种通常通过ajax去请求获取新的html元素的时候,我们无法在事前就给予事件的绑定,只能委托父级元素来操作。

7fe7a1c3cb8dca53f96542acc784730f.png

委托父级元素动态添加dom元素

jquery如何进行事件的委托处理?
jquery的.on方法内置了委托管理能力,代码如下:
html代码:

  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
f8611ac3f07779ce0de6f746bfffdd8c.png


jquery代码:

$(function () { $("ul").on("click

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值