click事件多次触发 jQuery
jQuery 中 click事件会累计绑定
例如下列代码:
aNode.click(function(){
bNode.click(function(){
console.log('haha');
});
});
如果把对bNode的点击事件绑定到aNode的点击事件里,那么每点击一次aNode就会绑定一次bNode,假设在点击bNode之前点击了3次aNode,那么点击bNode之后,控制台会出现三次haha。
因为jQuery中的click事件会累计绑定
为了避免上述情况发生,有两种解决办法:
1.应该避免把click事件绑定到其他的例如click,hover等事件中。
上述例子应该改成下面的形式:
aNode.click(function(){
});
bNode.click(function(){
console.log('haha');
});
2.如果必须把click事件绑定在其他的例如click,hover等事件中的话(例如需要用到其他作用域中的变量,尤其是存在listitem这种情况下),需要用到unbind事件

click事件多次触发 jQuery的更多相关文章
- JQuery实现click事件绑定与触发方法分析
原生JS通过什么方法绑定click事件? 原生js有一下三种方法为DOM对象绑定click事件, 第一种,在html中添加 onclick属性,在此属性中添加要绑定的事件函数,如下, 这种方法为htm ...
- jQuery中click事件多次触发解决方案
jQuery 中元素的click事件中绑定其他元素的click事件. 因为jQuery中的click事件会累计绑定,导致事件注册越来越多. 解决方案: 1.能够避开,避免把click事件绑定到其他元素 ...
- mschart asp chart 用法,包括前台写法与后台写法,还有click事件,如何触发。
纯后台动态生成aspchart ,这种方式没办法实现chart中click事件.click事件点击没有反应,用第二种可以实现点击事件. 两种方式实现同一种效果图: 第一种写法:后台动态生成aspcha ...
- element-ui中下拉菜单中的@click事件不会触发的问题
只需要将@click=“fun()”改为@click.native=“fun()”,即可监听下拉菜单的点击事件. 如图所示: 嗯,就酱~
- jquery 动态生成html后click事件不触发原因
转自:http://www.iam3y.com/html/560.html 最近在做一个项目的时候,遇到动态加载微博内容,然后点击“展开评论”后获取该微博的所有评论.这里使用了动态加载的<spa ...
- jQuery 学习笔记(5)(事件绑定与解绑、事件冒泡与事件默认行为、事件的自动触发、自定义事件、事件命名空间、事件委托、移入移出事件)
1.事件绑定: .eventName(fn) //编码效率略高,但部分事件jQuery没有实现 .on(eventName, fn) //编码效率略低,所有事件均可以添加 注意点:可以同时添加多个相同 ...
- 移动端touch事件影响click事件以及在touchmove添加preventDefault导致页面无法滚动的解决方法
这两天自己在写一个手机网页,用到了触屏滑动的特效,就是往右滑动的时候左侧隐藏的菜单从左边划出来. 做完之后在手机原生浏览器中运行正常,但在QQ和微信中打开,发现touchmove只会触发一次,而且to ...
- 移动端click事件延迟300ms的原因以及解决办法
这要追溯至 2007 年初.苹果公司在发布首款 iPhone 前夕,遇到一个问题 —— 当时的网站都是为大屏幕设备所设计的.于是苹果的工程师们做了一些约定,应对 iPhone 这种小屏幕浏览桌面端站点 ...
- 移动端click事件延迟300ms的原因以及解决办法[转载]
原文:http://www.bubuko.com/infodetail-822565.html 这要追溯至 2007 年初.苹果公司在发布首款 iPhone 前夕,遇到一个问题 —— 当时的网站都是为 ...
随机推荐
- c++11 类型推断
自动类型推断 当编译器能够在一个变量的声明时候就推断出它的类型,那么你就能够用auto关键字来作为他们的类型: auto x = 1; 编译器当然知道x是integer类型的.所以你就不用int了.接 ...
- 20165330 2017-2018-2《Java程序设计》课程总结
20165330 2017-2018-2<Java程序设计>课程总结 每周作业链接汇总 预备作业1:我期望的师生关系 预备作业2:做中学learning by doing个人感想及学习基础 ...
- QQ空间发表日志的图片上传功能实现
w间接促使了用户注意图片的顺序,进一步优化的方向的是手指触动或鼠标点击来同时进行图片的增删和调序,避免精确的数字输入. 有效code <form action="wcon/wact&q ...
- React中ref的用法
在React数据流中,父子组件唯一的通信方式是通过props属性:那么如果有些场景需要获取某一个真实的DOM元素来交互,这时候就要用到React的refs属性. 1.可以给DOM元素添加ref属性 c ...
- type为number的<input>标签 type和size属性失效
html5中input的type属性增的可取值新增几种,对于不支持这几种新增值的浏览器会统一解析为text类型. Firefox.ie9不支持
- Visual Studio 2017 新特性
1. out-variables(Out变量) 以前,我们使用out变量的时候,需要在外部先申明,然后才能传入方法,类似如下: string ddd = ""; //先申明变量 c ...
- linux系统centOS在虚拟机下的自定义安装
一 前戏 1.1在官网找到合适的版本,镜像文件 1.2安装VMware FF590-2DX83-M81LZ-XDM7E-MKUT4 CG54H-D8D0H-H8DHY-C6X7X-N2KG6 ZC3 ...
- iftop linux监控工具安装使用
Linux中查看网卡流量工具有iptraf.iftop以及nethogs等,iftop可以用来监控网卡的实时流量(可以指定网段).反向解析IP.显示端口信息等. 安装iftop的命令如下: CentO ...
- python web框架 Django的APP以及目录介绍 2
app: migrations 数据修改表结构 admin Django为我们提供的后台管理 apps 配置当前app models ORM,写指定的类 通过命令可以创建数据库结构 tests 单元测 ...
- GROUP BY 和 ORDER BY一起使用
转:http://lzfhope.blog.163.com/blog/static/636399220092554045196/ 环境:oracle 10g单单group by 或者order by本 ...