本文实例分析了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事件重复绑定的更多相关文章

  1. jquery事件重复绑定的几种解决方法 (二)

    防止事件重复绑定共有4种方法: bind().unbind()方法 live().die()方法 off().on()方法 one()方法 一.bind().unbind()方法 bind();绑定事 ...

  2. jquery事件重复绑定的几种解决方法

    防止事件重复绑定共有4种方法: bind().unbind()方法 live().die()方法 off().on()方法 one()方法 一.bind().unbind()方法 bind();绑定事 ...

  3. jquery事件重复绑定解决办法

    一$.fn.live 重复绑定 解决:使用die()方法,在live()方法绑定前,将此元素上的前面被绑定的事件统统解除,然后再通过live()方法绑定新的事件. //先通过die()方法解除,再通过 ...

  4. jquery事件重复绑定的快速解决方法

    click等事件 解决:使用unbind("click")方法先解除绑定的事件再绑定新事件,即在给对象绑定事件之前先移除该对象上的原有事件 1 $("#test2&quo ...

  5. 解决pjax重复加载js导致事件重复绑定的问题

    个人博客 地址:http://www.wenhaofan.com/article/20180925232057 1.所有js统一在pjax容器外引入 在pjax容器外引入的js只会被引入一次,所以不会 ...

  6. JQuery事件的绑定

    关于jQuery事件绑定html: <a href="#" onclick="addBtn()">addBtn</a> <div ...

  7. 解密jQuery事件核心 - 绑定设计(一)

    说起jQuery的事件,不得不提一下Dean Edwards大神 addEvent库,很多流行的类库的基本思想从他那儿借来的 jQuery的事件处理机制吸取了JavaScript专家Dean Edwa ...

  8. jquery 事件的绑定,触发和解绑

    js和jquery绑定的区别? HTML或原生js是单一对应绑定的,绑多了只留最后一个.jQuery是追加绑定的,绑多少执行多少.这个在每一本jQuery的书中都是首先提到的事情. jquery绑定与 ...

  9. jquery中事件重复绑定以及解绑问题

    一般的情况下,对于这种情况,我们常规的思路是,先解绑,再绑定,如下: $(selector).unbind('click').bind('click',function(){....}); 当这样会有 ...

随机推荐

  1. svn的安装方法

    SVN的安装很常用.但是我好像经常用了之后就忘记.这次把笔记放在这里,如果以后忘了,就可以随时查看了. 步骤: 一.下载SVN 这里常用的是site.zip. 之前是手头有现成的site.zip.今天 ...

  2. python中的风险

    from math import e print(e) e = "中华人民共和国1" print(e) 输出: 2.718281828459045 中华人民共和国1 用from方式 ...

  3. 转:eval(data)和eval("("+data+")")

    http://www.w3school.com.cn/jsref/jsref_eval.asp JavaScript eval() 函数:eval() 函数可计算某个字符串,并执行其中的的 JavaS ...

  4. navicat连接oracle失败

    正常是成功的,失败的话,就是oci.dll的问题 在这边下载: https://www.oracle.com/technetwork/topics/winsoft-085727.html 然后找到对应 ...

  5. Shiro 自定义角色 认证

    转载,原博文的地址在:https://ailongni.iteye.com/blog/2086022 由于Shiro filterChainDefinitions中 roles默认是and,/** = ...

  6. falsk 与 django 过滤器的使用与区别

    1,flask中内置的过滤器模板中常用方法: {#过滤器调用方式{{变量|过滤器名称}} #} <!-- safe过滤器,可以禁用转义 --> {{'<strong>hello ...

  7. linux strtock()函数使用问题

    strtok()原型:char * strtok(char *s, const char *delim); 函数说明:strtok()用来将字符串分割成一个个片段.参数s 指向欲分割的字符串,参数de ...

  8. SQL Server 2008 R2提示评估期已过

    解决SQL Server 2008 r2提示评估期已过 1.注册表把 HKEY_LOCAL_MACHINE\SOFTWARE\Microsoft\Microsoft SQL Server\100\Co ...

  9. objenesis

    1.objenesis About Objenesis is a small Java library that serves one purpose: To instantiate a new ob ...

  10. OpenWrt 路由系统上抓包

    版权声明:本文为博主原创文章.未经博主同意不得转载. https://blog.csdn.net/qianguozheng/article/details/32108093 前言: 做路由器开发,难免 ...