动态添加DOM时,绑定的click事件会重复执行
最近因为业务需求,需要重写window的alert和confirm弹窗,但是每次显示的提示按钮不相同,所有每次打开的弹窗都需要重写生成,但是对于相同的按钮会保留上次创建时的click事件,所以当你创建了多少次弹窗,你下次单击该按钮就会执行多少次,面对这个问题有两个解决方法:
1,每次关闭弹窗时都将其销毁,destory() 方法,将创建的dom从document中remove()掉;
2,将一些公共的btn设置为公用的dom,不需要每次都进行创建,这样在下一次为其btn绑定click事件时,unbind('click')上一次的click事件,就不会被执行多次了。
建议不要通过 $(ele).on('click',function(){})这种方式绑定事件。 这种方式会将原来的方法添加到新方法中,就会出现执行多次;
处理方式是 $(ele).unbind('click').click(function(){});
动态添加DOM时,绑定的click事件会重复执行的更多相关文章
- jquery中动态添加的标签绑定的click事件失效的解决办法
把.click()换成.live('click',function(){})(如果你的jquery的版本是1.10之前) 把.click()换成.on('click',function(){})(jq ...
- 【原生js】js动态添加dom,如何绑定事件
首先要明白浏览器在加载页面的时候是按顺序来加载的,这样以来就很清楚了,js动态添加dom以后,这些dom并没有绑定事件,这个时候最简单的一个办法就是:将绑定事件的方法封装到一个函数A中,在动态添加完d ...
- Jquery动态添加的元素绑定事件的3种方法
假设我们点击li标签,弹出他的文本,如果是动态添加的li,点击是没有效果的,压根弹不出来文本. 下面博主分享一下为动态添加的元素绑定事件的三种方法,网上一般都是两种,我在这里多增加了一种. 事件案例: ...
- 由于js词法性质和全局变量被更改,循环绑定的click事件执行时变量和定义时 不一致的bug,各种解决方案。
由于js词法性质和全局变量被更改,循环绑定的click事件执行时变量和定义时 不一致的bug,各种解决方案. 动态在页面上添加了5个按钮,实现的功能应该是点击对应按钮在控制台输出相应的索引.但因为应该 ...
- jQuery对 动态添加 的元素 绑定事件(on()的用法)
从jQuery 版本 1.7 起,on() 方法是向被选元素添加事件处理程序的(官方推荐)首选方法. 当浏览器下载完一个页面的时候就开始渲染(翻译)HTML标签,然后执行css.js代码,在执行js代 ...
- 一个DOM元素绑定多个事件时,先执行冒泡还是捕获
绑定在被点击元素的事件是按照代码顺序发生,其他元素通过冒泡或者捕获“感知”的事件,按照W3C的标准,先发生捕获事件,后发生冒泡事件.所有事件的顺序是:其他元素捕获阶段事件 -> 本元素代码顺序事 ...
- jQuery 为动态添加的元素绑定事件
在使用jquery的方式为元素绑定事件时,我经常使用bind或者click,但这只能为页面已经加载好的元素绑定事件.像需要用ajax的方式请求远程数据来动态添加页面元素时,显然以上几种绑定事件的方式是 ...
- WEB前端技巧之JQuery为动态添加的元素绑定事件.md
jquery 为动态添加的元素绑定事件 如果直接写click函数的话,只能把事件绑定在已经存在的元素上,不能绑定在动态添加的元素上 可以用delegate来实现 .delegate( select ...
- js动态添加的元素绑定事件
最近做的项目要实现一个动态添加动态删除的功能,思考了一下,该怎么给动态添加的元素绑定事件.最后觉得有两种方式比较可靠,第一种是在动态添加的html代码里添加oclick事件,然后给传个唯一的参数来判断 ...
随机推荐
- BZOJ 1733: [Usaco2005 feb]Secret Milking Machine 神秘的挤奶机
Description 约翰正在制造一台新型的挤奶机,但他不希望别人知道.他希望尽可能久地隐藏这个秘密.他把挤奶机藏在他的农场里,使它不被发现.在挤奶机制造的过程中,他需要去挤奶机所在的地方T(1≤T ...
- 四大主流云平台对比--CloudStack, Eucalyptus, vCloud Director和OpenStack。
我迟早可能都要进入的领域,提前温习... 还有KVM,ESXI,API,XEN之间的术语和关系,也要心中有数.. ~~~~~~~~~~~~~~~~~~~ 云计算在如今的IT界一直是一个最热门的话题,鉴 ...
- Java集合类之向量Vector
package com.test; import java.util.*; public class Demo7_3 { public static void main(String[] args) ...
- CP_THREAD_ACP与CP_ACP
在使用MultiByteToWideChar的时候,大部分都知道上述两个参数,MSDN上的解释也是简单到极致.通常我们会选择使用CP_ACP,但是总有人会在没有真正明白它们之间的区别前使用CP_THR ...
- Sublime Text主题下载、安装与配置
从下面地址下载主题包,以下载第一个为例,解压缩并重命名为Theme – Flatland 备注:下载好的文件中 .sublime-theme后缀的表示界面主题(theme),.tmTheme表示颜色 ...
- MySQL 授权详解
(1)确认一下3306是否对外开放,mysql默认状态下是不开放对外访问功能的.查看的办法如下: 1 2 3 4 5 6 7 netstat -an | grep 3306 tcp 0 ...
- poj棋盘分割(记忆化)
http://poj.org/problem?id=1191 黑书上P116 想了挺久 没想出来 想推出一公式来着 退不出来.. 想偏了 正解:递归 #include <iostream> ...
- BZOJ_1026_[SCOI2009]_windy数_(数位dp)
描述 http://www.lydsy.com/JudgeOnline/problem.php?id=1026 windy定义了一种windy数.不含前导零且相邻两个数字之差至少为2的正整数被称为wi ...
- BZOJ_1623:_[Usaco2008_Open]_Cow_Cars_奶牛飞车_(贪心)
描述 http://www.lydsy.com/JudgeOnline/problem.php?id=1623 n头牛,第i头牛的速度是si,m条路(m<=n).如果第i头牛前面有k头牛,它的速 ...
- 【转】Windows7打造全方位护眼系统
原文网址:http://www.cnblogs.com/duboway/archive/2013/04/20/3033257.html 电脑屏幕: Win7和Vista系统设置如下: 第一步:桌面空白 ...