JS中双击和单击事件冲突解决
在JS中代码中同一功能块中通常同时会用到单击、双击事件,但通常会遇到一个问题,就是在双击的时候即执行了一次双击事件,而且还执行了两次单击事件。此类冲突在ZTree、DHTMLX中经常遇到。
想要解决两个事件冲突,需要对单击事件进行延时,如果在此延时中又监测到单击事件,那么认为此两次单击属于一个双击事件,则只执行双击事件,并第一时间将延时定时器清理,以防止第二次单击生效。
具体代码如下:
var clickFlag = null;//是否点击标识(定时器编号)
function doOnClick(...) {
if(clickFlag) {//取消上次延时未执行的方法
clickFlag = clearTimeout(clickFlag);
}
clickFlag = setTimeout(function() {
// click 事件的处理
}, 300);//延时300毫秒执行
}
function doOnDblClick(...) {
if(clickFlag) {//取消上次延时未执行的方法
clickFlag = clearTimeout(clickFlag);
}
// dblclick 事件的处理
}
JS中双击和单击事件冲突解决的更多相关文章
- js中的点击事件(click)的实现方式
<!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8&quo ...
- JQuery如何实现双击事件时不触发单击事件,解决鼠标单双击冲突问题
在jQuery的事件绑定中,如果元素同时绑定了单击事件(click)和双击事件(dblclick),那么执行单击事件(click)时,不会触发双击事件(dblclick), 执行双击事件(dblcli ...
- Angular JS中双击事件ng-dblclick避免同时触发两次单击事件ng-click的解决方案
有些需求中,需要一个元素上既有双击事件,也有单击事件,而两者实现的效果不一样. 这时可以使用ng-dblclick与ng-click来实现需求,但是要避免浏览器将双击事件误认为是两次单击事件,从而出现 ...
- Android Listview中Button按钮点击事件冲突解决办法
今天做项目时,ListView中含有了Button组件,心里一早就知道肯定会有冲突,因为以前就遇到过,并解决过,可惜当时没有记录下来. 今天在做的时候,继续被这个问题郁闷了一把,后来解决后,赶紧来记录 ...
- 为什么JS是单线程?JS中的Event Loop(事件循环)?JS如何实现异步?setimeout?
https://segmentfault.com/a/1190000012806637 https://www.jianshu.com/p/93d756db8c81 首先,请牢记2点: (1) JS是 ...
- Android ScrollView 嵌套 ListView、 ListView 嵌套ScrollView Scroll事件冲突解决办法
本人菜鸟一名,最近工作了,开始学习Android. 最近在做项目的时候,UX给了个design,大概就是下拉刷新的ListView中嵌套了ScrollView,而且还要在ScrollView中添加动画 ...
- js中的异步与同步,解决由异步引起的问题
之前在项目中遇到过好多次因为异步引起的变量没有值,所以意识到了认识js中同步与异步机制的重要性 在单线程的js中,异步代码会被放入一个事件队列,等到所有其他代码执行后再执行,而不会阻塞线程. 下面是j ...
- Android动画及滑动事件冲突解决(转载)
原文链接:http://blog.csdn.net/singwhatiwanna/article/details/38168103 Android开发中动画和事件处理是程序员迈向高手的必经之路,也是重 ...
- GridView的点击事件冲突解决
在开发的时候,常常可能遇到ListView或GridView控件点击事件与Item点击事件冲突的问题.原因是Item布局中的button或ImageButton强制获取了item的焦点,解决方案之中的 ...
随机推荐
- 斯坦福机器学习视频笔记 Week1 线性回归和梯度下降 Linear Regression and Gradient Descent
最近开始学习Coursera上的斯坦福机器学习视频,我是刚刚接触机器学习,对此比较感兴趣:准备将我的学习笔记写下来, 作为我每天学习的签到吧,也希望和各位朋友交流学习. 这一系列的博客,我会不定期的更 ...
- SpringCloud之Eureka高可用集群环境搭建
注册中心集群 在微服务中,注册中心非常核心,可以实现服务治理,如果一旦注册出现故障的时候,可能会导致整个微服务无法访问,在这时候就需要对注册中心实现高可用集群模式. Eureka集群相当简单:相互注册 ...
- matlab画圆
MATLAB rectangle函数1 语法说明rectangle('Position', pos)rectangle('Position', pos, 'Curvature', cur)rectan ...
- CSS3按钮效果制作
CSS3按钮效果制作 首先附上效果图,按下去有一种下沉的效果, 未按效果 按下去效果 原理:第一个按钮相对比较简单,就直接是一个双重阴影效果,然后鼠标按下去让他的margin-top值为-3px,阴影 ...
- BI入门经典(转载)
原帖地址:http://blog.csdn.net/sgtzzc/archive/2009/10/10/4649770.aspx [前言] 昨天论坛的SQL Server大版新增了一个BI板块,大家讨 ...
- GeoServer基础教程(三):部署发布Shapefile地图数据
转载:http://blog.csdn.net/mingzai624. 这是GeoServer官方网站提供的一份Shapefile测试数据 nyc_roads.zip ,包含了部分纽约的道路信息,我们 ...
- (转)使用CUnit进行单元测试和覆盖率统计
CUnit安装 如果能联网的话,直接 yum install CUnit-devel.x86_64 就完成安装了,注意要安装devel版本,这样才能找到头文件. 编写单元测试代码 CUnit的测试是单 ...
- hdu-5653 Bomber Man wants to bomb an Array.(区间dp)
题目链接: Bomber Man wants to bomb an Array. Time Limit: 4000/2000 MS (Java/Others) Memory Limit: 65 ...
- python中的排序函数
1.sort() list类型有一个自带的排序函数sort() list.sort(cmp=None, key=None, reverse=False) 参数说明: (1) cmp参数 cmp接受一 ...
- Java 网络通信(TCP/UDP)
1.InetAdress类 与 Socket类 >InetAdress >Socket 2.TCP/IP协议簇 客户端: 创建 Socket:根据指定服务端的 IP 地址或端口号构 ...