举个例子,在同一个页面有下拉选择框

<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绑定事件 点击一次 执行多次 的解决办法的更多相关文章

  1. jquery-10 jquery中的绑定事件和解绑事件的方法是什么

    jquery-10 jquery中的绑定事件和解绑事件的方法是什么 一.总结 一句话总结:bind(); unbind(); one(); 1. jquery中的绑定事件和解绑事件的方法是什么? bi ...

  2. jquery中on绑定事件

    之前项目中动态创建的标签元素  在绑定事件的时候  都是无效  无论如何都不能触发 eg:在页面加载完成之后   再由脚本动态创建的<div>元素  在绑定事件的时候 例如click事件 ...

  3. (转载)js(jquery)的on绑定点击事件执行两次的解决办法

    js(jquery)的on绑定点击事件执行两次的解决办法—不是事件绑定而是事件冒泡 遇到的问题:jquery中用.on()给页面中新加的元素添加点击事件时,点击事件源,绑定的事件执行两次,这里的ale ...

  4. js便签笔记(6)——jQuery中的ready()事件为何需要那么多代码?

    前言: ready()事件的应用,是大家再熟悉不过的了,学jQuery的第一步,最最常见的代码: jQuery(document).ready(function () { }); jQuery(fun ...

  5. Jquery中on绑定的一些小坑

    ---恢复内容开始--- 今天我们来说说关于JQuery中事件绑定中on绑定的一些小问题,直接上代码了,大家拷下去就可以用 <!DOCTYPE html> <html lang=&q ...

  6. JQuery Mobile - 为什么绑定事件后会被多次执行?

    JQuery Mobile 在绑定事件时候,发现会被多次执行,为什么啊? 原来,jquery click  不是替换原有的function ,而是接着添加,所以才会执行次数越来越多,怎么办才能按需实现 ...

  7. 关于Jquery的delegate绑定事件无效

    今天在做一个页面,用的是easyui页面有很多的tabs,里面都放了iframe 需要在load事件动态调整iframe高度 发现始终无法使用delegate来绑定load事件. 纠结了一下午发现了问 ...

  8. 2017年3月25日工作日志:Jquery使用小结[绑定事件判断、select标签、军官证正则]

    jQuery获取DOM绑定事件 在1.8.0版本之前,我们要想获取某个DOM绑定的事件处理程序可以这样: $.data(domObj,'events');//或者$('selector').data( ...

  9. jQuery添加html绑定事件

    jQuery添加html绑定事件 $("#xxx").on("click",".dev",function(){ });

随机推荐

  1. alert 多语言的处理

    1. code <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <m ...

  2. 微信小程序中使用wxParse展示HTML内容

    wxParse的GitHub地址:https://github.com/icindy/wxParse 一.数据内容: 请求地址:https://m.quanchepin.com/index.php?a ...

  3. 查看postgre都有哪些语句占用CPU

    查看占用CPU最多的几个postgresql ps aux | grep postgres | sort -n -r -k 3 | head -10 | awk '{print $2, $3}' 查看 ...

  4. 【转】My App Crashed, Now What? – Part 1

    原文地址:http://www.raywenderlich.com/10209/my-app-crashed-now-what-part-1  By Matthijs Hollemans on Mar ...

  5. pt-duplicate-key-checker使用

    pt-duplicate-key-checker工具可以检测表中重复的索引,对于一些业务量很大的表,而且开发不规范的情况下有用.基本用法: 看一下我们的测试表: mysql> desc new_ ...

  6. 捕获Task.WhenALl返回的Task的Exception

    如果有一个任务抛出异常,则Task.WhenAll 会出错,并把这个异常放在返回的Task 中.如果多个任务抛出异常,则这些异常都会放在返回的Task 中.但是,如果这个Task 在被await 调用 ...

  7. Java不带.classpath的svn项目下载,转成到eclipse中

    .classpath是Eclipse的工程文件,别人没有将工程的信息传到SVN库中,就检查不出.classpath文件,识别不了项目结构. 这种做法也是比较提倡的方法.SVN上只要有项目的源码信息就可 ...

  8. 【Leetcode】【Easy】Reverse Linked List

    题目: Reverse a singly linked list. 解题: 反转单链表,不再多介绍了. 如果会“先条件->定参数->确定不变式->验证后条件”的思维方法,一定会bug ...

  9. jbd2/dm-2-8 io太高

    用iotop查看发现[jbd2/dm-2-8]几乎占用了99%的io使用率,但是却没有输入输出 后来上网查找,网上有人说是个内核bug,需要升级内核,或者降低jdb2的提交次数,即重新挂载磁盘 添加c ...

  10. Jquery学习---Easy UI 框架

    Jquery的easyui 1.1. easyui的目录分析 以 jquery Easy UI 1.3.2 版本学习 demo 实例 locale 国际化信息 plugins 框架一些插件 src 源 ...