防止事件重复绑定共有4种方法:

  1. bind()、unbind()方法
  2. live()、die()方法
  3. off()、on()方法
  4. one()方法

  一、bind()、unbind()方法

  bind();绑定事件

  为被选元素添加一个或多个事件处理程序,并规定事件发生时运行的函数。

  从某种角度上讲,bind("click",function(){})与click(function(){})是等价的。

  unbind();移除通过bind()方法添加的事件

  不仅仅对于bind()方法有效,它对于click()方法同样有效。

  $("#btn1").unbind("click").bind("click",function(){
  alert("我是btn1!");
  });
  $("#btn1").unbind().click(function(){
alert("我是btn1!");
});

  二、live()、die()方法

  live();

  jQuery1.3增加了一个live()方法,给所有当前以及将来会匹配的元素绑定一个事件处理函数。

  支持:click,dblclick, mousedown, mouseup等。

  不支持 :blur, focus, mouseenter, mouseleave, change, submit。

  live()一次只能绑定一个事件

    jquery利用了事件的冒泡机制,直接把事件绑定在了document上,然后通过event.target找出事件的来源。

  要移除用live绑定的事件,请用die()方法

  die();

  在jquery里,使用live()来绑定事件,若想移除该事件,要使用die()方法。

  $("#btn1").die("click").live("click",function() {
  alert("我是btn1!");
  });

  三、off()、on()方法

  on();绑定事件。

  从jQuery 1.7开始,on()函数提供了绑定事件处理程序所需的所有功能,用于统一取代以前的bind()、 delegate()、 live()等事件函数。

  即使是执行on()函数之后新添加的元素,只要它符合条件,绑定的事件处理函数也对其有效。

  该函数可以为同一元素、同一事件类型绑定多个事件处理函数。触发事件时,jQuery会按照绑定的先后顺序依次执行绑定的事件处理函数。

  要删除通过on()绑定的事件,请使用off()函数。

  如果要附加一个事件,只执行一次,然后删除自己,请使用one()函数。

  off();解除绑定事件

  off()函数用于移除元素上绑定的一个或多个事件的事件处理函数。

  off()函数主要用于解除由on()函数绑定的事件处理函数。

  on();函数和off();函数的返回值都为jQuery类型,返回当前jQuery对象本身。

  $("#btn1").off("click").on("click",function(){
  alert("我是btn1!");
  });

  四、one();方法

  绑定的事件处理函数只会执行一次。

  $("#btn1").one("click",function(){
  alert("我只执行一次!");
  });

jquery事件重复绑定的几种解决方法的更多相关文章

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

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

  2. jquery事件重复绑定

    本文实例分析了jQuery防止重复绑定事件的解决方法.分享给大家供大家参考,具体如下: 一.问题: 今天发现jQuery一个对象的事件可以重复绑定多次,当事件触发的时候会引起代码多遍执行. 下面是一个 ...

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

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

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

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

  5. Electron与jQuery中$符号冲突的三种解决方法

    在Electron工程中引用jQuery时,经常会出现以下错误: Uncaught ReferenceError: $ is not defined 解决的具体方法如下: ①.在测试的过程中(测试过1 ...

  6. 史上最全的CSS hack方式一览 jQuery 图片轮播的代码分离 JQuery中的动画 C#中Trim()、TrimStart()、TrimEnd()的用法 marquee 标签的使用详情 js鼠标事件 js添加遮罩层 页面上通过地址栏传值时出现乱码的两种解决方法 ref和out的区别在c#中 总结

    史上最全的CSS hack方式一览 2013年09月28日 15:57:08 阅读数:175473 做前端多年,虽然不是经常需要hack,但是我们经常会遇到各浏览器表现不一致的情况.基于此,某些情况我 ...

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

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

  8. 【JQuery】jQuery(document).ready(function($) { });的几种表示方法及load和ready的区别

    jQuery中处理加载时机的几种方式 第一种: jQuery(document).ready(function() { alert("你好"); }); //或 $(documen ...

  9. php 生成唯一id的几种解决方法

    php 生成唯一id的几种解决方法   网上查了下,有很多的方法 1.md5(time() . mt_rand(1,1000000)); 这种方法有一定的概率会出现重复 2.php内置函数uniqid ...

随机推荐

  1. Android Unresolved Dependencies

    在Android Studio的开发中,在软件中集成了ButterKnife插件,另外需要集成ButterKnife的jar包.因为本地没有现成的,所以在module的build.gradle文件中添 ...

  2. VTK初始化New返回Null问题

    原文链接:http://www.cppblog.com/mythma/archive/2013/08/02/vtk-6-new-null.html 在使用VTK6.0时候,会遇到X::New()返回为 ...

  3. VS2013配置编译Caffe-Win10_X64

    原文链接:http://blog.csdn.net/joshua_1988/article/details/45036993 有少量修改................ 2014年4月的时候自己在公司 ...

  4. matlab学习使用Button Group绘制不同的正弦曲线

    创建buttongroup控件---即按钮组 再添加三个radiobutton 对其设置 buttongroup控件改Title为绘制不同正弦曲线 第一个radiobutton的string改为sin ...

  5. day37-2元类,单例模式

    目录 元类 造类的第一种形式 class做了什么事 控制元类产生的类 控制元类产生的对象 实例化类 加上元类后类的属性查找顺序 元类控制模版 单例模式 1. 使用类方法的特性 2. 使用装饰器 3. ...

  6. day007 列表类型、元祖类型、 字典类型、 集合类型的内置方法

    目录 列表数据类型的内置方法 作用 定义方式 优先掌握的方法 需要掌握的方法 元祖类型的内置方法 作用 定义方式 优先掌握的方法(参考列表方法) 字典类型的内置方法 作用 定义方式 优先掌握的方法 需 ...

  7. Python——Numpy基础知识(一)

    一.Numpy的引入 1.标准的Python 中用列表(list)保存一组值,可以当作数组使用.但由于列表的元素可以是任何对象,因此列表中保存的是对象的指针.对于数值运算来说,这种结构显然比较浪费内存 ...

  8. POJ3069 Saruman's Army【贪心】

    Saruman the White must lead his army along a straight path from Isengard to Helm's Deep. To keep tra ...

  9. 07.网络编程-3.TCP

    1.tcp相关介绍 TCP协议,传输控制协议(英语:Transmission Control Protocol,缩写为 TCP)是一种面向连接的.可靠的.基于字节流的传输层通信协议,由IETF的RFC ...

  10. JS控制全屏,监听退出全屏事件

    实现方案 //进入全屏 function requestFullScreen(de) { if(de.requestFullscreen){ //W3C de.requestFullscreen(); ...