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

<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. JS里的居民们7-对象和数组转换

    编码 学习通用的数据用不同的数据结构进行存储,以及相互的转换 对象转为数组: var scoreObject = { "Tony": { "Math": 95, ...

  2. HTTP状态码302、303、307区别

    HTTP状态码3XX表示重定向,表明浏览器需要执行某些特殊的处理以正确处理请求. 301 Moved Permanently 永久性定向.该状态码表示请求的资源已被分配了新的URI,以后应使用资源现在 ...

  3. CentOS 7运维管理笔记(4)----安装ftp服务器

    在CentOS 7下安装ftp服务器,可以使局域网内的主机拥有共享文件的一个站点. 在Linux系统下,vsftp是一款应用比较广泛的FTP软件,其特点是小巧轻快,安全易用.目前在开源操作系统中常用的 ...

  4. freebsd默认不是gcc构建

    xunsearch在freebsd上死活装不上,用gcc编译通过. freebsd默认不是gcc编译工程,所以下个gcc ./configure CC=gcc48 编译. 觉得clang编译器不可能有 ...

  5. 制作Makefile中 ** missing separator 错误解决

    非常简单就是根据提示,在这一行的前面摁Tab键 错误如上图所示:

  6. Jmeter对HTTP请求压力测试、并发测试

    最近公司需要开发一个简单的报名系统,供外网用户提供报名服务,由于我们公司是个初创的微型公司,开发人员都是刚毕业不久,开发经验相当缺乏. 对于服务器性能测试这块的经验更是少得可以忽略.迫使不得不让我们去 ...

  7. restful知识点之二restframework视图

    restful协议理解:面向资源开发 restful协议 ---- 一切皆是资源,操作只是请求方式 ----book表增删改查 /books/ books /books/add/ addbook /b ...

  8. c# js日期工具

    c#获取日期当年最后一天:model.StartDate.AddYears(1).AddSeconds(-1) js日期工具: var dateToolObj = { methods: { //url ...

  9. SVN常用功能介绍(二)

    说明 上一章节主要描述了SVN的简介.安装搭建,和项目管理人员对SVN的常用操作. 这章主要讲解,SVN对应角色组员,在实际运用中的常用操作. 将SVN服务器项目导入到开发组员的本地电脑里 方式一: ...

  10. centos7和centos6区别

    CentOS 7 vs CentOS 6的不同   (1)桌面系统[CentOS6] GNOME 2.x[CentOS7] GNOME 3.x(GNOME Shell) (2)文件系统[CentOS6 ...