扫码关注官方订阅号
我现在写的页面会动态加载一些元素,而这些元素都需要添加点击事件,但是如果每次新元素加载完我用类过滤器给这些元素添加点击事件,那么已经加载的元素又加了一次点击事件.
欢迎选择我的课程,让我们一起见证您的进步~~
很简单啊,事件代理。这种方式是最优雅的。楼上有 hack 成分。
用楼上方式,你需要为页面上已存在元素的事件和动态添加元素的事件分别绑定一次。
已存在元素
动态添加元素
而事件代理,只须一次。并且代码简洁。
$('body').on('click', 'button', function(){ //.... })
这种把子元素(button)代理到父元素(body)的方式,可满足动态元素. 如上,动态添加的 button 也是有事件的。
因为事件是作用在 body 上的,只要你body元素不是动态的,其子元素再怎么动态都是可以绑定的。
当然,上面的 body 可以是任意你要动态添加的元素的父元素,但是这个父元素不能是动态添加的。
手机码字不宜。
简单粗暴的办法 能先remove掉事件,在绑定。略作参考哦,http://www.cnblogs.com/heiniuhaha/archive/2011/08/07/jquery-event-repeat-bind.html应该还有更加优雅的方式
当时的做法是这样的,或许可以帮到你。比如我要新加载一个p标签直接为这个p加事件肯定行不通嘛~
解决方案:第一种:将新加载的p标签放在我指定的标签内,例如<p id='外部'><p id='新加载'></p></p>只要写id为外部的p点击事件或其他事件就好了。
第二种:新增加的标签属性直接添加事件,例如<p id='新加载' onclick="点击事件()"></p>。
当然你说的是jquery实现,最后一种方案貌似不太符合你的预期,手机码字,就打这么多了。
动态添加的元素,添加到页面中之前,先生成jquery元素,然后想怎么绑怎么绑,最后再加到页面中
举个栗子
var d=$("<p></p>"); d.click(function(){}); $("body").append(d);
微信扫码关注PHP中文网服务号
QQ扫码加入技术交流群
扫描下载App
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
PHP学习
技术支持
返回顶部
很简单啊,事件代理。这种方式是最优雅的。楼上有 hack 成分。
用楼上方式,你需要为页面上
已存在元素
的事件和动态添加元素
的事件分别绑定一次。而事件代理,只须一次。并且代码简洁。
这种把子元素(button)代理到父元素(body)的方式,可满足动态元素. 如上,动态添加的 button 也是有事件的。
因为事件是作用在 body 上的,只要你body元素不是动态的,其子元素再怎么动态都是可以绑定的。
当然,上面的 body 可以是任意你要动态添加的元素的父元素,但是这个父元素不能是动态添加的。
手机码字不宜。
简单粗暴的办法 能先remove掉事件,在绑定。
略作参考哦,http://www.cnblogs.com/heiniuhaha/archive/2011/08/07/jquery-event-repeat-bind.html
应该还有更加优雅的方式
当时的做法是这样的,或许可以帮到你。
比如
我要新加载一个p标签
直接为这个p加事件肯定行不通嘛~
解决方案:
第一种:将新加载的p标签放在我指定的标签内,例如<p id='外部'><p id='新加载'></p></p>
只要写id为外部的p点击事件或其他事件就好了。
第二种:新增加的标签属性直接添加事件,例如<p id='新加载' onclick="点击事件()"></p>。
当然你说的是jquery实现,最后一种方案貌似不太符合你的预期,手机码字,就打这么多了。
动态添加的元素,添加到页面中之前,先生成jquery元素,然后想怎么绑怎么绑,最后再加到页面中
举个栗子