java多次点击时事件_click事件的累加绑定,绑定一次点击事件,执行多次

我的github(PS:希望star):https://github.com/thWinterSun/v-admin

最近做项目为一个添加按钮绑定点击事件,很简单的一个事情,于是我按照通常做法找到元素,使用jquery的on()方法为元素绑定了点击事件,点击同时发送请求。完成后看效果,第一次点击没有问题。再一次点击后发现发送了两次请求,后面再点击发现请求的数量越来越多。这时我初步判断可能是元素有多个或是多次调用了方法,但找了一遍,发现只为一个元素绑定了事件,且只调用了一次。后来通过查资料才知道是点击事件被累加绑定了!那到底什么是累加绑定呢?什么时候会发生累加绑定?累加绑定后该如何解决呢?下面我就通过这三个问题来说一下。

48304ba5e6f9fe08f3fa1abda7d326ab.png

1 $("#adsCollection_tb .contentDel").on("click",function(){2   $(this).each(function(){3var obj_address_name = $(this).parent().parent().find(".obj_address_name").html();4 var jsonDel ={5 "head": {6   "module": "object",7    "function": "del_obj"

8 },9 "body":[10 {11    "name": obj_address_name12 }13 ]14 }15 alert("确定要删除这一条吗?")16 addrGroup.Ajax(jsonDel);17

18   });19 });

48304ba5e6f9fe08f3fa1abda7d326ab.png

在页面中为一个元素绑定事件,事件执行后页面未刷新且元素还在,然后你再次点击,元素又被绑定个一次点击事件,这样第二次点击就会执行两次,以此类推。

如何解决累加绑定:第一种方法是元素点击后删除,然后再动态创建一个元素,再添加点击事件。显然这个方式很麻烦。

第二中方法是使用jquery的one()方法,为元素绑定一个一次性的事件处理函数,这个事件处理函数只会被执行一次。

1 $("#adsCollection_tb").one("click",function(){2 alert("执行");3 })

第三种方法是在每次绑定点击事件前先解除之前的事件绑定,再为元素绑定事件,类似于先清空,在做操作一样。但你使用bind()方法绑定时,可以用unbind()方法解除绑定。通常我们跟愿意用on()方法绑定事件,因为bind()方法已经不被推荐,那么那么就用off()方法解除事件绑定。

1 $("#adsCollection_tb").unbind("click").bind("click",function(){

2 alert("执行");

3 });

4 $("#adsCollection_tb").off("click").on("click",function(){

5 alert("执行");

6 });

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/506396.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

基于matlab的fisher线性判别及感知器判别_基于嵌入表示的网络实体对齐方法进展概述...

网络实体对齐是指给定两个网络,把两个网络中等价的实体合并。实体对齐在很多领域都有重要应用,比如,跨平台社交网络的用户对齐可以用于用户画像、用户兴趣挖掘,跨语言知识图谱的实体对齐可以辅助机器翻译、跨语言信息检索。传统的…

mfc指示灯报警显示_奔驰车辆常用指示灯功能讲解

点击箭头处“蓝色字”,关注我们哦!!今天将为大家解析车辆仪表盘指示灯功能,当然,我们为大家带来的是奔驰车型的指示灯解读。奔驰在指示灯上的设计是什么风格呢?下面我们就来带大家详细解读。疲劳驾驶报警指…

java无锁消费者框架_无锁并行框架多生产者多消费者模型

下面看一下多生产多消费者的模式,下面的代码是模拟100个生产者,每个生产者生产100个事件,然后有3个消费者,同时进行消费,共消费1W个事件,下面看一下代码:这边new出了3个消费者,并把消…

win10无法连接到这个网络_电脑无法连接网络怎么办?(有线网络篇)

哈喽!各位小伙伴大家好呀!好久不见,近期真的太多小伙伴咨询网络问题了,没办法,虽然以前写过相关文章,断网、网络卡、慢、掉线的常规解决方法不过可能还不够细致,本篇就尽量把所有的问题都提出解…

LeetCode反转链表java_Leetcode 反转链表系列 图解详细过程

对于一个程序猿来说,数据结构和算法的重要性就不用我多说了吧,算法题已然成了现在大厂笔试面试的重头戏,废话少说,Leetcode 刷起来呀。说起刷 Leetcode,我建议你按 tag 刷,不然只能像无头苍蝇,东…

amd插帧技术如何开启_联想ThinkPad笔记本电脑如何开启CPU的虚拟化技术图文教程...

联想ThinkPad笔记本电脑如何开启CPU的虚拟化技术图文教程很多情况下可能我们都需要开启CPU虚拟化技术,例如我们需要打开安卓模拟器,在打开安卓模拟器的时候如果提示您需要CPU虚拟化技术,那么我们需要在主板BIOS设置中进行开启,下面…

没有内存条电脑能开机吗_换内存加固态,老电脑也能快到起飞,附纯国产内存条雷赤测评...

我在公司里用的那台电脑是品牌机,配置有点低,处理器是i3-6100,内存是4GB,硬盘是1TB的机械,这个配置日常办公是没有问题的,但是现在有一些活已经超出了这个配置的能力,加之近期的一些工作还需要在…

嵌入式编程要不要学数据结构_少儿编程要不要学?其实国家早就给出了答案……...

随着人工智能的热度不断攀升,少儿编程越来越火,逐渐成为爸妈们的热门话题。自家的孩子适不适合学习少儿编程,很多专业人士发出了各种不同的声音。这也让很多望子成龙的家长一头雾水,分不清究竟该何去何从?那么&#xf…

nrf52840 gpiote如何配置中断输入_西门子S7-200 SMART PID回路控制,配置PID向导,查看项目组件...

本篇我们继续来学习西门子S7-200 SMART的PID回路控制,首先介绍一下如何配置PID向导。在工具菜单功能区单击PID按钮打开PID回路向导对话框,选择要组态的回路,最多可组态8个回路,这里我们选择回路0。选择回路0在左侧的树视图中单击回…

java 大流量高并发_【BAT面试题】如何应对大流量、高并发??

这是一道BAT大厂的面试题所谓高并发指的是:在同时或极短时间内,有大量的请求到达服务端,每个请求都需要服务端耗费资源进行处理,并做出相应的反馈。常用的高并发处理的思路与手段从服务端视角看高并发服务端处理请求需要耗费服务端…

创建一个storageevent事件_谈谈StorageEvent

编者按:本文作者 刘观宇,360 奇舞团高级前端工程师、技术经理,W3C CSS 工作组成员。纷纷红紫已成尘,布谷声中夏令新。夹路桑麻行不尽,始知身是太平人。 ——宋.陆游 《初夏绝句》我们在开发多Tab应用时候,常…

matlab数组平方的计算自定义函数_从零开始的matlab学习笔记——(38)简单数论计算函数:取整,gcd,lcm,质数,全排列...

matlab应用——求极限,求导,求积分,解方程,概率统计,函数绘图,三维图像,拟合函数,动态图,傅里叶变换,随机数,优化问题....更多内容尽在个人专栏&a…

bootstraptable导出excel独立使用_使用 EasyPOI 优雅导出Excel模板数据(含图片)

EasyPOI功能如同名字Easy,主打的功能就是容易,让一个没接触过POI的人员可以方便的写出Excel导出,Excel模板导出,Excel导入,Word模板导出。通过简单的注解和模板语言(熟悉的表达式语法),完成以前复杂的写法。…

import pandas as pd什么意思_Pandas万花筒:让绘图变得更美观

全文共1803字,预计学习时长10分钟图源:tehrantimes流行 Python 数据分析库 Pandas 中的绘图功能一直是迅速绘制图表的首选之一。但是,其可用的可视化效果总是十分粗略,实用有余、美观不足。笔者常用 Pandas 的绘图功能快速地执行一…

jquery name选择器_jquery笔记

jQuery是一个封装好的特定的集合(方法和函数)。是一个库,封装了很多预先定义好的函数在里面。概念jQuery是一个快速,简洁的js库。j是js,query是查询,把js中的DOM操作作了封装,我们可以快速的查询使用里面的功能。jQuer…

python数据库框架_目前最受欢迎的12个Python开源框架

1 Django Django是一款用Python语言写的免费开源的 Python Web应用开发框架,它遵循模型 -视图-控制器(MVC)的架构模式。它是由非营利Django维护软件基金会(DSF)和3条款BSD许可下可用,鼓励快速发展和实用的设计。Django同时是一款在数据库功能、后台功能、…

jenkins java常用插件下载,Jenkins简单介绍以及插件入门

Jenkins是一个广泛用于持续构建的可视化web工具,就是各种项目的的“自动化”编译、打包、分发部署,将以前编译、打包、上传、部署到Tomcat中的过程交由Jenkins,Jenkins通过给定的代码地址,将代码拉取到jenkins宿主机上&#xff0c…

linux安装python3.7的步骤_Linux 安装python3.7.3

我这里使用的是Redhat6.5,centos系统本身默认安装有python2.x,版本x根据不同版本系统有所不同,可通过 python --V 或 python --version 查看系统自带的python版本 有一些系统命令时需要用到python2,不能卸载 1、安装依赖包 1&…

python画三维立体图难吗_万万没想到,Python竟能绘制出如此酷炫的三维图

作者 | Jay Alammar转载自 | 高级农民工 通常我们用 Python 绘制的都是二维平面图,但有时也需要绘制三维场景图,比如像下面这样的:这些图怎么做出来呢?今天就来分享下如何一步步绘制出三维矢量(SVG)图。 八…

php人物行走,非常震撼的纯CSS3人物行走动画

今天分享给大家的是一个用纯CSS3实现的人物行走动画,在没有使用JavaScript的情况下,用CSS3技术将人物行走的姿态描绘得非常逼真。其实动画实现的原理也是比较简单的,将人物行走时的状态分割成多张图片,然后利用CSS3的动画属性将这…