click事件的累加绑定
click事件的累加绑定,绑定一次点击事件,执行多次。
在页面中为一个元素绑定事件,事件执行后页面未刷新且元素还在,然后你再次点击,元素又被绑定一个点击事件,这样第二次点击就会执行两次,以此类推。
如何解决累加绑定?具体方法有三种:
第一种方法是:元素点击后删除,然后再动态创建一个元素,再添加点击事件。(该方法比较麻烦)
第二种方法是:使用jQuery的one()方法,为元素绑定一个一次性的事件处理函数,这个事件处理函数只会被执行一次,代码如下:
$("#saveBtn").one("click",function(){});
第三种方法是:在每次绑定点击事件之前先解除之前 的事件绑定,再为元素绑定事件,类似于先清空再做操作一样。当使用bind()方法绑定时,可以使用unbind方法解除 绑定。通常我们更愿意用on()方法绑定事件,因为bind()方法已经不被推荐,那么就用off()方法解除事件绑定。
$("#saveBtn").unbind("click").bind("click",function(){});
$("#saveBtn").off("click").on("click",function(){});
click事件的累加绑定的更多相关文章
- click事件的累加绑定,绑定一次点击事件,执行多次
最近做项目为一个添加按钮绑定点击事件,很简单的一个事情,于是我按照通常做法找到元素,使用jquery的on()方法为元素绑定了点击事件,点击同时发送请求.完成后看效果,第一次点击没有问题.再一次点击后 ...
- jq和js中click 事件的几种方式总结和click事件的累加问题解决办法
1:常见的三种绑定click事件: 第一种:$("#click").click(function(){ alert("Hello World click") ...
- jQuery-介绍 加载 选择器 样式操作 属性操作 绑定click事件
jQuery - 介绍 加载 选择器 样式操作 属性操作 绑定click事件 注意:以下部分问题不能实现效果,因该是单词拼写错误(少个t)或者没有加引号(“swing”)... jquery介绍 jQ ...
- 解决jQuery中dbclick事件触发两次click事件
首先感谢这位小哥!http://qubernet.blog.163.com/blog/static/1779472842011101505853216/ 太长姿势了. 在jQuery事件绑定中,dbc ...
- jQuery中click事件多次触发解决方案
jQuery 中元素的click事件中绑定其他元素的click事件. 因为jQuery中的click事件会累计绑定,导致事件注册越来越多. 解决方案: 1.能够避开,避免把click事件绑定到其他元素 ...
- click事件多次触发 jQuery
jQuery 中 click事件会累计绑定 例如下列代码: aNode.click(function(){ bNode.click(function(){ console.log('haha'); } ...
- JQuery实现click事件绑定与触发方法分析
原生JS通过什么方法绑定click事件? 原生js有一下三种方法为DOM对象绑定click事件, 第一种,在html中添加 onclick属性,在此属性中添加要绑定的事件函数,如下, 这种方法为htm ...
- 关于移动端click事件绑定的一个细节
click是最常见的点击事件,但是对于移动终端,比如手机,一般都是以touch事件代替的,而click事件在手机也是生效的,只是会有1-2秒左右的延迟,那么当你想要用click而非touch事件的时候 ...
- 动态添加DOM时,绑定的click事件会重复执行
最近因为业务需求,需要重写window的alert和confirm弹窗,但是每次显示的提示按钮不相同,所有每次打开的弹窗都需要重写生成,但是对于相同的按钮会保留上次创建时的click事件,所以当你创建 ...
随机推荐
- 【PHP】composer 常用命令
- MQTT结构分析
MQTT,是: 轻量级的消息订阅和发布(publish/subscribe)协议 建立在TCP/IP协议之上 IoT,internet of things,物联网,MQTT在这方面应用较多. 官方网站 ...
- fsck修复系统断电或非正常关机导致的系统磁盘问题
问题描述: unexpected inconsistency; run fask mannally. (i.e., without -a or -p options) fsck repaire man ...
- redis系列:主从复制
1 简介 这篇文章主要讲述Redis的主从复制功能.会依次从环境搭建.功能测试和原理分析几个方面进行介绍. 2 准备工作 服务器架构图如下 启动主服务器101,使用info replication命令 ...
- 关于layui弹出层的使用
Jquery必须大于1.83 layui必须是all,否则不显示 <script src="../js/jquery-1.8.3.min.js"></script ...
- LVM使用
LVM框架 LVM实验环境准备 创建一个128MB的文件模拟磁盘 [centos@centos lvm]$ dd if=/dev/zero of=./disk.img count=128 bs=1MB ...
- Java 课上的语录
Java 课上的语录 在用系统类库的类的时候啊,你是不是充分的理解这个系统类库的类.比如这个 ArrayList 你是不是知道它里面有这样那样这样那样的函数,能够帮你做各种各样的事情.很重要,你不知道 ...
- laravel 常见操作
1.url()
- oracle分页计算公式
//page是页数,rows是显示行数 int page=2; int rows=5; List<Articles> list=a.select(page*rows+1,(page-1)* ...
- Java8 使用 stream().map()提取List对象的某一列值及排重
List对象类(StudentInfo) public class StudentInfo implements Comparable<StudentInfo> { //名称 privat ...