jquery事件重复绑定
本文实例分析了jQuery防止重复绑定事件的解决方法。分享给大家供大家参考,具体如下:
一、问题:
今天发现jQuery一个对象的事件可以重复绑定多次,当事件触发的时候会引起代码多遍执行。
下面是一个click事件被重复绑定的示例:
|
1
2
3
4
5
6
7
8
9
10
11
12
13
|
function reg_button_click(){ $("#button).click(function(){ alert("button click"); });}$(document).ready(function(){ #重复注册3次 reg_button_click(); reg_button_click(); reg_button_click(); #触发的时候 出现3个alert $('#button').click();}); |
二、解决方法:
对于需要重复绑定的场景,再事件注册时候考虑用先unbind 再bind的方法;或者先off 再on
|
1
2
3
4
5
6
7
8
9
10
11
12
13
|
function reg_button_click(){ $("#button).unbind('click').bind('click',(function(){ alert("button click"); });}$(document).ready(function(){ #重复注册3次 reg_button_click(); reg_button_click(); reg_button_click(); #触发的时候 出现3个alert $('#button').click();}); |
jquery事件重复绑定的更多相关文章
- jquery事件重复绑定的几种解决方法 (二)
防止事件重复绑定共有4种方法: bind().unbind()方法 live().die()方法 off().on()方法 one()方法 一.bind().unbind()方法 bind();绑定事 ...
- jquery事件重复绑定的几种解决方法
防止事件重复绑定共有4种方法: bind().unbind()方法 live().die()方法 off().on()方法 one()方法 一.bind().unbind()方法 bind();绑定事 ...
- jquery事件重复绑定解决办法
一$.fn.live 重复绑定 解决:使用die()方法,在live()方法绑定前,将此元素上的前面被绑定的事件统统解除,然后再通过live()方法绑定新的事件. //先通过die()方法解除,再通过 ...
- jquery事件重复绑定的快速解决方法
click等事件 解决:使用unbind("click")方法先解除绑定的事件再绑定新事件,即在给对象绑定事件之前先移除该对象上的原有事件 1 $("#test2&quo ...
- 解决pjax重复加载js导致事件重复绑定的问题
个人博客 地址:http://www.wenhaofan.com/article/20180925232057 1.所有js统一在pjax容器外引入 在pjax容器外引入的js只会被引入一次,所以不会 ...
- JQuery事件的绑定
关于jQuery事件绑定html: <a href="#" onclick="addBtn()">addBtn</a> <div ...
- 解密jQuery事件核心 - 绑定设计(一)
说起jQuery的事件,不得不提一下Dean Edwards大神 addEvent库,很多流行的类库的基本思想从他那儿借来的 jQuery的事件处理机制吸取了JavaScript专家Dean Edwa ...
- jquery 事件的绑定,触发和解绑
js和jquery绑定的区别? HTML或原生js是单一对应绑定的,绑多了只留最后一个.jQuery是追加绑定的,绑多少执行多少.这个在每一本jQuery的书中都是首先提到的事情. jquery绑定与 ...
- jquery中事件重复绑定以及解绑问题
一般的情况下,对于这种情况,我们常规的思路是,先解绑,再绑定,如下: $(selector).unbind('click').bind('click',function(){....}); 当这样会有 ...
随机推荐
- TOP100summit:【分享实录-Microsoft】基于Kafka与Spark的实时大数据质量监控平台
本篇文章内容来自2016年TOP100summit Microsoft资深产品经理邢国冬的案例分享.编辑:Cynthia 邢国冬(Tony Xing):Microsoft资深产品经理.负责微软应用与服 ...
- {MySQL的逻辑查询语句的执行顺序}一 SELECT语句关键字的定义顺序 二 SELECT语句关键字的执行顺序 三 准备表和数据 四 准备SQL逻辑查询测试语句 五 执行顺序分析
MySQL的逻辑查询语句的执行顺序 阅读目录 一 SELECT语句关键字的定义顺序 二 SELECT语句关键字的执行顺序 三 准备表和数据 四 准备SQL逻辑查询测试语句 五 执行顺序分析 一 SEL ...
- MySQL 聚合函数以及 优先级
1 from 2 where 3 group by 4 having 5select 6distinct 7 order by 8 limit sum 求和 avg ...
- linux shutdown命令以及参数详解
在说shutdown命令之前 先说一下sync命令: sync:将内存中尚未写入硬盘的数据写入硬盘 因为linux为了保证数据读写速度,把常用的数据放在内存中,不会立即写入硬盘,如果有不当关机,这些数 ...
- Html吸顶效果
Html吸顶效果 一.HTML HTML中需要给div一个id <!DOCTYPE html> <html lang="en"> <head> ...
- iOS 精简Controlelr代码的两个方法
MVC是苹果推荐使用的iOS APP架构.后来又有MVVM,MVP等架构出现.主要目的是让业务逻辑.展示.数据各个层级解耦.实现最大程度上的代码复用. 对MVC这种架构来说,随着APP中模的增多,控制 ...
- 双栈算术表达式求值算法 栈(Stack) - Java实现
https://mp.weixin.qq.com/s/dg8mgd6CIQ7Tui1_fQwSBA https://github.com/toywei/DataStructure/tree/maste ...
- oracle基本命令笔记
最近由于工作原因,再次接触oracle,因此重新来熟知下oracle基本的命令. --改密码 1.运行——键入“cmd” 回车2.键入“sqlplus/nolog” 回车3.键入“conn/as sy ...
- Linux中常用命令
.cd命令 cd 回到跟目录 cd uqihong 进入到uqihong这个文件夹(且cd命令只能一级一级的进入) 2.复制命令 cp -r /usr/local/tomcat ...
- 关于byte[]与string、Image转换
byte[]与string转换 参考网址:https://www.cnblogs.com/xskblog/p/6179689.html 1.使用System.Text.Encoding.Default ...