关于jquery on方法进行事件绑定触发次数指数叠加的问题
发生环境:
$modal.on('click', '#search',function(e){});
上面代码的语法是这样的:
.on( events [, selector ] [, data ], handler(eventObject) )
其中$modal为父容器,在该容器上绑定click事件,当id为search的button被点击时才触发function
存在问题:
1. 点击第一次触发一次
2. 点击第二次触发两次
3. 点击第三次触发四次
...
以此类推成指数增长
问题原因:on('click')的重复绑定
解决办法:
1.使用unbind,代码如下:(会取消绑定该容器下所有子元素的click事件)
$modal.unbind('click').on('click', '#search',function(e){});
2.直接使用子元素进行绑定,代码如下:
$('#search').click(function(e){});
tips:
1. on()是将function绑定在元素上
2. click()是将function绑定在click事件上
可能是由于这两个原因导致on可能发生重复绑定多个事件,而只要click一次,click()的function只执行一次
关于jquery on方法进行事件绑定触发次数指数叠加的问题的更多相关文章
- jQuery的4种事件绑定方法
jQuery中提供了四种绑定事件的方法,分别是bind.live.delegate.on,对应的解除监听的函数分别是unbind.die.undelegate.off: 一.on()方法(首选方法) ...
- jquery 新建的元素事件绑定问题
js的事件监听跟css不一样,css只要设定好了样式,不论是原来就有的还是新添加的,都有一样的表现.而事件监听不是,你必须给每一个元素单独绑定事件. 常见的例子是处理表格的时候.每行行末有个删除按钮, ...
- jquery 新建的元素事件绑定问题研究[转]
原文:http://www.cnblogs.com/linzheng/archive/2010/10/17/1853568.html js的事件监听跟css不一样,css只要设定好了样式,不论是原来就 ...
- jquery on方法(事件委托)
jquery绑定事件处理函数的方法有好几个,比如:bind(),on(),delegate(),live(). 其中delegate和live都是用on实现的,效果也类似,live好像在1.7版本中已 ...
- jquery中的DOM事件绑定与解绑
在jquery事件中有时候有的事件只需要在绑定后有效触发一次,当通过e.target判断触发条件有效触发后解除绑定事件,来避免多次无效触发和与未知情况造成冲突. 这时候就要用到了jquery中的事件绑 ...
- 【JQuery源码】事件绑定
事件绑定的方式有很多种.使用了jQuery那么原来那种绑定方式(elem.click = function(){...})就不推荐了,原因? 最主要的一个原因是elem.click = fn这种方式只 ...
- [Web 前端] 027 jQuery 相关尺寸与事件绑定
1. 相关尺寸 1.1 获取元素相对于文档的偏移量 var pos = $('#small').offset(); console.log(pos.left, pos.top); 1.2 获取当前元素 ...
- jQuery mouseove和mouseout事件不断触发
关于锋利的jQuery第三章结尾提示图片效果(鼠标放在图片上会出现一个大图跟随鼠标移动)实现时mouseove和mouseout事件不断触发的问题 html <ul class="bo ...
- [jQuery]on和bind事件绑定的区别
on和bind事件绑定的区别 一个demo展示 <!DOCTYPE html> <html lang="zh"> <head> <titl ...
随机推荐
- ajax成功跨域_自己写的
跨域的简单原理:一般浏览器会阻止js请求异端服务器(A服务器请求B服务器).js连接却除外 如:<script type="text/jscript" src="h ...
- ViewController respondsToSelector:]: message sent to deallocated instance
今天突然遇到这个问题,其实昨天下班的时候就已经有这个问题了, 就是先进入一个画页,然后再快速离开这个画页再进入其他画页就出现这个错误 了 找了好久也没有找出问题来,一开始以为是网络任务没有cancel ...
- tomcat 无法加载js和css 等静态文件的问题
前段时间做了个网站,在本地tomcat测试都没有问题,但是部署到阿里云上之后,系统样式全没了.jsp等动态页面访问正常. 打开浏览器监控发现所有的css 和js 文件返回都是404 .直接访问单个的c ...
- SmartUpLoad自动上传包
一枚默默的开发学习者 用以下代码生成文件名即可 1 package info.haowei.util; 2 3 import java.text.SimpleDateFormat; 4 import ...
- 7Z命令行详解
7z.exe在CMD窗口的使用说明如下: 7-Zip (A) 4.57 Copyright (c) 1999-2007 Igor Pavlov 2007-12-06 Usage: 7za <co ...
- Linux中zip压缩和unzip解压缩命令详解
文章转自:http://www.jb51.net/LINUXjishu/105916.html 1.把/home目录下面的mydata目录压缩为mydata.zipzip -r mydata.zip ...
- HTML5+学习笔记1-------边看代码边研究中
document.addEventListener('touchstart',function(){ return false; },true); touchstart当手指触摸屏幕时候触发,即使已经 ...
- Ubuntu 16.10 虚拟机安装记录
一定要选自定义. 这里一定要选 稍后安装操作系统 都是坑! 启动时出现'SMBus Host Controller not enabled'错误提示,进不到图形界面. 解决办法:1.在启动Ubunt ...
- List<List<double>> lsls = null; 根据double值来重新排序lsls...
"确定:Node-data = (7,2).具体是:根据x维上的值将数据排序, 6个数据的中值(所谓中值,即中间大小的值)为7, 所以Node-data域位数据点(,).这样, 该节点的分割 ...
- 电脑网线/水晶头的连接方法(A类,B类)
一般的橙白,橙,绿白,蓝,蓝白,绿,棕白,棕. 若是只有四根线的,则任选四根,做线时对应水晶头的1\2\3\6四个入口压制即可. 如果只有一根网线,但想两台机子同时上网,不增加外设,做网线时45水晶头 ...