防止事件重复绑定共有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. 一篇关于蓝牙SDP和L2CAP协议的文章

    SDP地址:http://www.cnblogs.com/strive-forever/archive/2011/11/04/2236640.html L2CAP地址:http://www.cnblo ...

  2. Step1:SQL Server 复制介绍

    一.本文所涉及的内容(Contents) 本文所涉及的内容(Contents) 前言(Introduction) 复制逻辑结构图(Construction) 系列文章索引(Catalog) 总结&am ...

  3. linux系统Centos环境下搭建SVN服务器及权限配置

    linux系统Centos环境下如何搭建SVN服务器以及svnserve.conf.authz.passwd配置文件详细介绍   至于svn的概念,这里就不做详细阐述了,可以自行百度.简单来讲就是一个 ...

  4. 怎样从外网访问内网Django?

    本地安装了一个Django,只能在局域网内访问,怎样从外网也能访问到本地的Django呢?本文将介绍具体的实现步骤. 准备工作 安装并启动Django 默认安装的Django端口是8000. 实现步骤 ...

  5. IOS 苹果手机fiddler抓包时出现了tunnel to 443 解决方案,亲测有效

    先上一张捉取成功图[版本需4.0以上,并非所有https数据可抓取,具体原因未知] 1.先对Fiddler进行设置[打开Fiddler ——> Options .然后打开的对话框中,选择HTTP ...

  6. P3157 [CQOI2011]动态逆序对(树状数组套线段树)

    P3157 [CQOI2011]动态逆序对 树状数组套线段树 静态逆序对咋做?树状数组(别管归并QWQ) 然鹅动态的咋做? 我们考虑每次删除一个元素. 减去的就是与这个元素有关的逆序对数,介个可以预处 ...

  7. JS方法转字符串

    今天接手的代码比较特殊,需要动态拼接一个table,每一行<tr>都是通过转换为字符串,再拼接在一起放到tbody中的. 其中有的td标签中有a标签,需要给a标签添加点击事件,参数好多,动 ...

  8. 关于er模型中的identifying relationship or non-identifying relationship

    最近,主要负责项目管理和领域模型设计方面的工作,昨天在将UML类图转换为ER模型的时候,发现有identifying relationship or non-identifying relations ...

  9. NPM安装步骤

    一.使用之前,我们先来掌握3个东西是用来干什么的. npm: Nodejs下的包管理器. webpack: 它主要的用途是通过CommonJS的语法把所有浏览器端需要发布的静态资源做相应的准备,比如资 ...

  10. Python邮件发送脚本(Linux,Windows)通用

    脚本 #!/usr/bin/python #-*- coding:utf-8 -*- #Python Mail for chenglee #if fileformat=dos, update file ...