jquery 使事件失效-动态生成dom元素时,jquery点击风暴失败

2023-08-26 0 2,438 百度已收录

这周我在工作中遇到了一些小问题。 我趁着不加班的机会把它们记录下来。 我的记忆力还不如Mac钥匙。 哈哈,我先背一首诗吧。

问题

页面上的一些元素是由js动态生成的。 将一些干扰绑定到这些元素jquery 使事件失效,例如点击jquery 使事件失效,将不会生效。 为什么?

解决方案

我先说一下解决办法。

//监听新增DOM元素的点击事件
$('#domId').on('click','.newClass',function(){
			//doSomething;
})
//此处的'#domId'必须是你页面初始化时就加载好的dom节点,也就是你html中本来就存在的。
//此处的'.newClass'是你要监听的新增的DOM元素标识。
//注:.newClass需是#domId的子元素。

扩展()

on()技术现在已经很强大了,不仅可以窃听点击,还可以窃听其他干扰。 它还简化了代码,因为您可以利用所选元素的子元素。

jquery 使事件失效-动态生成dom元素时,jquery点击风暴失败

句型

$(selector).on(event,childSelector,data,function)

定义和用法

on() 方法向所选元素和子元素添加一个或多个风暴处理程序。

从 jQuery 1.7 版开始,on() 方法是 bind()、live() 和 delegate() 方法的新替代品。 这种方法给API带来了很多便利,我们推荐使用这种方法,它简化了jQuery代码库。

一些笔记

注意:使用 on() 方法添加的 Storm 处理程序适用于当前和未来的元素(例如由脚本创建的新元素)。

提示:要删除风暴处理程序,请使用 off() 方法。

提示:如果您想添加仅运行一次的风暴然后将其删除,请使用 one() 方法。

不只是点击,还有哪些方式可以点击on()呢?

由于文档没有直接说明支持哪些风暴,所以:

以下是我从被否认的峰会中收集到的信息:

	blur focus focusin focusout resize scroll click dblclick 
    mousedown mouseup mousemove mouseover mouseout mouseenter mouseleave 
    change select submit keydown keypress keyup contextmenu

并且,除此之外,甚至还支持自定义事件,通过trigger方法来触发自定义事件即可。

收藏 (0) 打赏

感谢您的支持,我会继续努力的!

打开微信/支付宝扫一扫,即可进行扫码打赏哦,分享从这里开始,精彩与您同在
点赞 (0)

悟空资源网 jquery jquery 使事件失效-动态生成dom元素时,jquery点击风暴失败 https://www.wkzy.net/game/164155.html

常见问题

相关文章

官方客服团队

为您解决烦忧 - 24小时在线 专业服务