解决jquery绑定click事件出现点击一次执行两次问题
问题定位:通过浏览器F12定位到点击一次出现两次调用。
问题复现:
$("#mail_span").on("click",function(){
if($(".treeselect").children(".treeselect-up").css("display")=="none"){
treeSelectClick();
var $up = $(".treeselect").find(".treeselect-up");
$up.css({
display : "block"
});
$("#mail_bottom").attr("class", "glyphicon glyphicon-triangle-top");
}else{
treeSelectClick();
$("#mail_bottom").attr("class", "glyphicon glyphicon-triangle-bottom");
}
}
})
问题解决:
$("#mail_span").on("click",function(e){
if(!e.isPropagationStopped()){//确定stopPropagation是否被调用过
if($(".treeselect1").children(".treeselect-up").css("display")=="none"){
treeSelectClick();
var $up = $(".treeselect1").find(".treeselect-up");
$up.css({
display : "block"
});
$("#mail_bottom").attr("class", "glyphicon glyphicon-triangle-top");
}else{
treeSelectClick();
$("#mail_bottom").attr("class", "glyphicon glyphicon-triangle-bottom");
}
}
e.stopPropagation();//必须要,不然e.isPropagationStopped()无法判断stopPropagation是否调用过
})
查阅资料:
event.preventDefault() :阻止默认行为,可以用 event.isDefaultPrevented() 来确定preventDefault是否被调用过了
event.stopPropagation() :阻止事件冒泡,事件是可以冒泡的,为防止事件冒泡到DOM树上,不触发任何前辈元素上的事件处理函数,可以用 event.isPropagationStopped() 来确定stopPropagation是否被调用过了
解决jquery绑定click事件出现点击一次执行两次问题的更多相关文章
- JS: javascript 点击事件执行两次js问题 ,解决jquery绑定click事件出现点击一次执行两次问题
javascript 点击事件执行两次js问题 在JQuery中存在unbind()方法,先解绑再添加点击事件,解决方案为: $(".m-layout-setting").unbi ...
- google跟踪代码管理器gtm无法给相同class元素绑定click事件埋点解决
Google 跟踪代码管理器是一个跟踪代码管理系统 (TMS),可以帮助您快速轻松地更新网站或移动应用上的跟踪代码及相关代码段(统称为“代码”).将一小段跟踪代码管理器代码添加到项目后,您可以通过网页 ...
- IOS上给body和html绑定click事件的坑
场景: 在ios上(包括iPhone和ipad) 给window ,html,document,body绑定click事件,点击不会触发 由于ios浏览器都用的safari内核,所以ios浏览器全部中 ...
- ios 设备用jquery live绑定 click 事件不管用
问题描述:用js拼接的html追加到页面,然后用 live 绑定click事件不起作用 解决办法:1.直接在标签写onclick事件 2.给需要绑定的标签添加css样式{cursor:pointe ...
- JQuery实现click事件绑定与触发方法分析
原生JS通过什么方法绑定click事件? 原生js有一下三种方法为DOM对象绑定click事件, 第一种,在html中添加 onclick属性,在此属性中添加要绑定的事件函数,如下, 这种方法为htm ...
- jquery单选框radio绑定click事件实现和是否选中的方法
使用jquery获取radio的值,最重要的是掌握jquery选择器的使用,在一个表单中我们通常是要获取被选中的那个radio项的值,所以要加checked来筛选,比如有以下的一些radio项: 1. ...
- jquery单选框radio绑定click事件实现方法
本文实例讲述了jquery单选框radio绑定click事件实现方法.分享给大家供大家参考. 具体实现方法如下: 复制代码代码如下: <html><head><title ...
- jquery批量绑定click事件
jquery批量绑定click事件: var selects = $(".public_select dd ul li"); debugger; /*$(".public ...
- jQuery-介绍 加载 选择器 样式操作 属性操作 绑定click事件
jQuery - 介绍 加载 选择器 样式操作 属性操作 绑定click事件 注意:以下部分问题不能实现效果,因该是单词拼写错误(少个t)或者没有加引号(“swing”)... jquery介绍 jQ ...
随机推荐
- Windows 7 系统中开启 ASP.NET State Service 服务的方法
控制面板 -> 程序和功能 -> “打开或者关闭 Windows 功能”对话框 -> Internet 信息服务 -> 万维网服务 -> 应用程序开发功能 -> A ...
- MySQL--Percona-XtraDB-Cluster 5.6安装笔记
安装环境: 有三台干净的CentOS 6的服务器,IP配置为:192.168.166.169,192.168.166.170,192.168.166.171,准备搭建三节点的Percona XtraD ...
- 在Windows7系统上能正常使用的程序,Windows10运行后部分状态不能及时变更
这是最近在开发一个通信项目时遇到的问题,一开始以为是窗体样式的原因,把窗体换成系统窗体之后还是在Win10上不能正常使用,后面突然想到会不会是匹配原因,试了一下,结果真的就正常了. 问题:例如一个通信 ...
- 在windows10上创建ASP.NET mvc5+Memcached服务
感谢两位两位大佬: https://blog.csdn.net/l1028386804/article/details/61417166 https://www.cnblogs.com/running ...
- 【BZOJ3551】 [ONTAK2010]Peaks加强版
BZOJ3551 [ONTAK2010]Peaks加强版 Solution Kruscal重构树后发现可以对于小于的离散化然后倍增+主席树找到上一个的可行解. 然后就可以了. 如果数组开的不好,容易在 ...
- spring cloud学习(五) 配置中心
Spring Cloud Config为服务端和客户端提供了分布式系统的外部化配置支持.配置服务中心采用Git的方式存储配置文件,因此我们很容易部署修改,有助于对环境配置进行版本管理. 一.配置中心 ...
- 跟着刚哥学习Spring框架--事务配置(七)
事务 事务用来保证数据的完整性和一致性. 事务应该具有4个属性:原子性.一致性.隔离性.持久性.这四个属性通常称为ACID特性.1.原子性(atomicity).一个事务是一个不可分割的工作单位,事务 ...
- SpringCloud之Ribbon
一:Ribbon是什么? Ribbon是Netflix发布的开源项目,主要功能是提供客户端的软件负载均衡算法,将Netflix的中间层服务连接在一起.Ribbon客户端组件提供一系列完善的配置项如连 ...
- centos7----pstree
centos 默认没有pstree 安装 yum -y install psmisc
- Nuget 打包
https://github.com/NuGetPackageExplorer/NuGetPackageExplorer 下载地址 1 打包的dll 中没有依赖 最简单的情况,保证dll放到lib下, ...