jquery事件重复绑定的几种解决方法 (二)
防止事件重复绑定共有4种方法:
- bind()、unbind()方法
- live()、die()方法
- off()、on()方法
- 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事件重复绑定的几种解决方法 (二)的更多相关文章
- jquery事件重复绑定的几种解决方法
防止事件重复绑定共有4种方法: bind().unbind()方法 live().die()方法 off().on()方法 one()方法 一.bind().unbind()方法 bind();绑定事 ...
- jquery事件重复绑定
本文实例分析了jQuery防止重复绑定事件的解决方法.分享给大家供大家参考,具体如下: 一.问题: 今天发现jQuery一个对象的事件可以重复绑定多次,当事件触发的时候会引起代码多遍执行. 下面是一个 ...
- jquery事件重复绑定解决办法
一$.fn.live 重复绑定 解决:使用die()方法,在live()方法绑定前,将此元素上的前面被绑定的事件统统解除,然后再通过live()方法绑定新的事件. //先通过die()方法解除,再通过 ...
- jquery事件重复绑定的快速解决方法
click等事件 解决:使用unbind("click")方法先解除绑定的事件再绑定新事件,即在给对象绑定事件之前先移除该对象上的原有事件 1 $("#test2&quo ...
- Electron与jQuery中$符号冲突的三种解决方法
在Electron工程中引用jQuery时,经常会出现以下错误: Uncaught ReferenceError: $ is not defined 解决的具体方法如下: ①.在测试的过程中(测试过1 ...
- 史上最全的CSS hack方式一览 jQuery 图片轮播的代码分离 JQuery中的动画 C#中Trim()、TrimStart()、TrimEnd()的用法 marquee 标签的使用详情 js鼠标事件 js添加遮罩层 页面上通过地址栏传值时出现乱码的两种解决方法 ref和out的区别在c#中 总结
史上最全的CSS hack方式一览 2013年09月28日 15:57:08 阅读数:175473 做前端多年,虽然不是经常需要hack,但是我们经常会遇到各浏览器表现不一致的情况.基于此,某些情况我 ...
- 解决pjax重复加载js导致事件重复绑定的问题
个人博客 地址:http://www.wenhaofan.com/article/20180925232057 1.所有js统一在pjax容器外引入 在pjax容器外引入的js只会被引入一次,所以不会 ...
- 【JQuery】jQuery(document).ready(function($) { });的几种表示方法及load和ready的区别
jQuery中处理加载时机的几种方式 第一种: jQuery(document).ready(function() { alert("你好"); }); //或 $(documen ...
- php 生成唯一id的几种解决方法
php 生成唯一id的几种解决方法 网上查了下,有很多的方法 1.md5(time() . mt_rand(1,1000000)); 这种方法有一定的概率会出现重复 2.php内置函数uniqid ...
随机推荐
- 2017-2018-2 20165215 实验四《Android开发基础》实验报告
2017-2018-2 20165215 实验四<Android开发基础>实验报告 一.实验报告封面 课程:Java程序设计 班级:1652班 姓名:张家佳 学号:20165215 指导教 ...
- Linux 配置 JDK
1. 上传 JDK 2. 解压文件 tar -xvf 文件名 3. 配置环境变量: 指令 vim /etc/profile 以上格式是不变的,使用时只改变 JAVA_HOME 和 JAVA_BIN 的 ...
- 从源码层面聊聊面试问烂了的 Spring AOP与SpringMVC
Spring AOP ,SpringMVC ,这两个应该是国内面试必问题,网上有很多答案,其实背背就可以.但今天笔者带大家一起深入浅出源码,看看他的原理.以期让印象更加深刻,面试的时候游刃有余. Sp ...
- MySQL底层索引剖析
1:Mysql索引是什么 mysql索引: 是一种帮助mysql高效的获取数据的数据结构,这些数据结构以某种方式引用数据,这种结构就是索引.可简单理解为排好序的快速查找数据结构.如果要查“mysql” ...
- MySQL字符类型datetime与timestamp
这片博客来详细分区一下这哥俩! 首先来说明这两个字符类型: DATETIME 8 1000-01-01 00:00:00 ~9999~12-31 23:59:59 0000-00-00 00:00:0 ...
- kivy 滑动
from kivy.uix.gridlayout import GridLayout from kivy.app import App from kivy.lang.builder import Bu ...
- P2219 [HAOI2007]修筑绿化带(单调队列)
P2219 [HAOI2007]修筑绿化带 二维单调队列 写了这题 P2216 [HAOI2007]理想的正方形 后,你发现可以搞个二维单调队列 来保存矩形(i+1,i+A-1)(j+1,j+B-1 ...
- java中线程的停止以及LockSupport工具类
看jstack输出的时候,可以发现很多状态都是TIMED_WAITING(parking),如下所示: "http-bio-8080-exec-16" #70 daemon pri ...
- ldap集成rabbitmq
rabbitmq版本: 3.7.4 rabbitmq支持ldap需要开启插件: rabbitmq-plugins enable rabbitmq_auth_backend_ldap rab ...
- vue2.0之echarts使用
1.首先下载echart依赖 npm install echarts --save备注:npm 安装报错时使用cnpm 2.全局注册 在main.js里引入echart并在vue中注册echart / ...