解决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 ...
随机推荐
- SharePoint 列表中增加列编辑功能菜单
需求描述 在企业的部署中,经常将SharePoint和TFS集成在一起,两个系统之间相互读取数据,展现开发进度.在TFS 2018之前版本中,由于TFS的门户定制功能有限,用户比较喜欢使用ShareP ...
- Aspose.Words 将word2中的内容插入到word1中的指定位置
将word2中的内容插入到word1中的指定位置(经测试可用) 在官网找到的例子,记录一下: public static void InsertDocumentAtBookmark(string da ...
- Shell命令之文本操作
前言 在Linux中,文本处理操作是最常见的,应用非常广泛,如果能熟练掌握,可以大大提高开发效率. awk/sed/grep是文本操作领域的“三剑客”,学会了这3个命令就可以应对绝大多数文本处理场景. ...
- Linux系统软件包的管理(4)
虽然使用源码编译安装可以具有提高速度个性化的定制等优点,但对于 Linux发行商来说,则不容易管理软件包,毕竟不是每个人都会进行源码编译的,如果能够将软件预先在相同的硬体与系统上面编译好在发布的话,不 ...
- jsp的两个include了解
在jsp中三大指令(page -- include -- taglib)中有一个 include 然后再三个动作标签中(include -- forward -- param)中也有一个includ ...
- Spring static 静态属性注入
<bean class="org.springframework.beans.factory.config.MethodInvokingFactoryBean"> &l ...
- win7 配置Windows Update 失败,还原更改,无法进入系统
win7 配置Windows Update 失败,还原更改,无法进入系统 win7 系统安装好后,忘记了需要关闭自动更新,某天自动更新补丁安装失败,进入下图状态,无法进入正常系统. 解决方案一:使用+ ...
- HTML元素ID和JS方法名重复,JS调用失败
HTML元素ID和JS方法名重复时,JS中的重名方法无法被找到,不能执行. 修改ID或者方法名,两者不一致即可.
- JS生成某个范围的随机数【四种情况详解】
JS没有现成的函数,能够直接生成指定范围的随机数. 但是它有个函数:Math.random() 这个函数可以生成 [0,1) 的一个随机数. 利用它,我们就可以生成指定范围内的随机数. 而涉及范围的 ...
- mysql之视图,存储过程,触发器,事务
视图 视图是一个虚拟表(非真实存在),其本质是[根据SQL语句获取动态的数据集,并为其命名],用户使用时只需使用[名称]即可获取结果集,可以将该结果集当做表来使用. 使用视图我们可以把查询过程中的临时 ...