Jquery中on绑定事件 点击一次 执行多次 的解决办法
举个例子,在同一个页面有下拉选择框
<select class="mySelect">
<option value="user">按用户分析</option>
<option value="dept">按单位分析</option>
<option value="role">按角色分析</option>
</select>
当选择用户分析时,一组用户查询条件展示出来,queryUser查询按钮显示,并绑定查询方法countByUser(),$("#queryUser").on("click",countByUser);
当选择单位分析时,一组单位查询条件展示出来,queryDept查询按钮显示,并绑定查询方法countByDept(),$("#queryDept").on("click",countByDept);
当选择角色分析时,一组角色查询条件展示出来,queryRole查询按钮显示,并绑定查询方法countByRole(),$("#queryRole").on("click",countByRole);
先选择按用户分析,此时queryUser按钮绑定了一次click事件,再选择按单位分析,再选择按用户分析,此时queryUser按钮又绑定了一次click事件,点击查询按钮会调用两次countByUser()方法。
解决办法是在绑定click之前先解绑方法,或者调用完方法之后解绑。
$("#queryUser").off("click"); //如果该对象存在其他click事件先解绑事件
$("#queryUser").on("click",countByUser); //绑定事件
Jquery中on绑定事件 点击一次 执行多次 的解决办法的更多相关文章
- jquery-10 jquery中的绑定事件和解绑事件的方法是什么
jquery-10 jquery中的绑定事件和解绑事件的方法是什么 一.总结 一句话总结:bind(); unbind(); one(); 1. jquery中的绑定事件和解绑事件的方法是什么? bi ...
- jquery中on绑定事件
之前项目中动态创建的标签元素 在绑定事件的时候 都是无效 无论如何都不能触发 eg:在页面加载完成之后 再由脚本动态创建的<div>元素 在绑定事件的时候 例如click事件 ...
- (转载)js(jquery)的on绑定点击事件执行两次的解决办法
js(jquery)的on绑定点击事件执行两次的解决办法—不是事件绑定而是事件冒泡 遇到的问题:jquery中用.on()给页面中新加的元素添加点击事件时,点击事件源,绑定的事件执行两次,这里的ale ...
- js便签笔记(6)——jQuery中的ready()事件为何需要那么多代码?
前言: ready()事件的应用,是大家再熟悉不过的了,学jQuery的第一步,最最常见的代码: jQuery(document).ready(function () { }); jQuery(fun ...
- Jquery中on绑定的一些小坑
---恢复内容开始--- 今天我们来说说关于JQuery中事件绑定中on绑定的一些小问题,直接上代码了,大家拷下去就可以用 <!DOCTYPE html> <html lang=&q ...
- JQuery Mobile - 为什么绑定事件后会被多次执行?
JQuery Mobile 在绑定事件时候,发现会被多次执行,为什么啊? 原来,jquery click 不是替换原有的function ,而是接着添加,所以才会执行次数越来越多,怎么办才能按需实现 ...
- 关于Jquery的delegate绑定事件无效
今天在做一个页面,用的是easyui页面有很多的tabs,里面都放了iframe 需要在load事件动态调整iframe高度 发现始终无法使用delegate来绑定load事件. 纠结了一下午发现了问 ...
- 2017年3月25日工作日志:Jquery使用小结[绑定事件判断、select标签、军官证正则]
jQuery获取DOM绑定事件 在1.8.0版本之前,我们要想获取某个DOM绑定的事件处理程序可以这样: $.data(domObj,'events');//或者$('selector').data( ...
- jQuery添加html绑定事件
jQuery添加html绑定事件 $("#xxx").on("click",".dev",function(){ });
随机推荐
- ASP.NET MVC中,前台DropDownList传值给后台。
List<SelectListItem> ZH = new List<SelectListItem>(); ZH.Add(new SelectListItem { Text = ...
- null id in com.rocky.** entry 错误处理
1. 概述 使用hibernate往mysql数据库插入记录出错如下 10:37:57,364 ERROR [AssertionFailure] an assertion failure occure ...
- Visual Studio扩展与更新中插件被禁用,安装后无法使用
在Visual Studio中的扩展与更新中安装插件后,显示[禁用],重新安装后仍然不能使用,但是VS默认安装的扩展却可以正常使用. 这里需要注意下方显示“当前不允许加载每用户扩展”,点击“启用每用户 ...
- C++中精确到小数点后任意位
#include <iostream> #include <iomanip> //用setprecision(n)设置精度,其中n表示精确到小数点后n位 using names ...
- 如何一次性下载某个类库依赖的所有jar包"
** 经常碰到这种事情: ** 在一些非maven工程中(由于某种原因这种工程还是手工添加依赖的),需要用到某个新的类库(假设这个类库发布在maven库中),而这个类库又间接依赖很多其他类库,如果依赖 ...
- Hyperledger Fabric 1.0 学习搭建 (二)--- 源码及镜像文件处理
2.1下载Fabric源码下载Fabric源码是因为要用到源码中提到的列子和工具, 工具编译需要用到go语言环境, 因此需要把源码目录放到$GOPATH下. 通过1.3中go的安装配置, $GOPAT ...
- 学习Road map Part 02 机器学习和图像识别
方法:结合项目.竞赛.mentor计划
- June 26th 2017 Week 26th Monday
I am a little tempted, but so afraid to look in your eyes. 我对你有一点动心,却如此害怕看你的眼睛. Now that you are tem ...
- angular里forRoot的作用
模块A是这样定义的 @NgModule({ providers: [AService], declarations: [ TitleComponent ], exports: [ TitleCompo ...
- 使用redux开发的简单步骤
一.安装redux包 npm install redux --save 二.根据APP数据结构或者后台请求的数据结构拟定state的大致结构. 可以把state写成一个对象字面量,放在reducer文 ...