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的焦点,解决方案之中的 ...
随机推荐
- 【Flask】Column常用参数
### Column常用参数:1. primary_key:设置某个字段为主键.2. autoincrement:设置这个字段为自动增长的.3. default:设置某个字段的默认值.在发表时间这些字 ...
- 剑指offer之 二进制中1的个数
问题描述: 请实现一个函数,输入一个整数,输出该数二进制表示中1的个数.例如把9表示成二进制是1001,有2位是1 因此如果输入9,该函数输出2; package Problem10; public ...
- sql 常用的查询套路
1. 写一个sql:,查询商城每天的用户数及每天累计用户数 date user_count total_count2016-12-01 1 12016- ...
- 代码题(2)— 统计所有小于非负整数 n 的质数的数量
质数也叫素数,只能被1和它本身整除的. 利用筛选法. class Solution { public: int countPrimes(int n) { ) ; ; vector<); ;i&l ...
- C# 往excel出力数据
/// <summary> /// 出力Excel /// </summary> /// <param name="storeModelForExcel&quo ...
- Saiku_00_资源帖
一.精选 1.李秋 随笔分类 - pentaho 二.概述 1.Saiku + Kylin 多维分析平台探索 三.Saiku+Kylin 1.使用Saiku+Kylin构建多维分析OLAP平台 2.使 ...
- 原生JS实现淡入淡出效果(fadeIn/fadeOut/fadeTo)
淡入淡出效果,在日常项目中经常用到,可惜原生JS没有类似的方法,而有时小的页面并不值得引入一个jQuery库,所以就自己写了一个,已封装, 有用得着的朋友, 可以直接使用. 代码中另附有一个设置元素透 ...
- php实现多文件上传和下载。
http://1229363.blog.163.com/blog/static/19743427200751291055264/
- 每天一个linux命令(6):rm命令
版权声明更新:2017-05-10博主:LuckyAlan联系:liuwenvip163@163.com声明:吃水不忘挖井人,转载请注明出处! 1文章介绍 本文介绍了Linux下面的rm命令. 2 开 ...
- [Ural1099]工作安排 带花树
题目大意 一般图最大匹配. 题解: 求解一般图最大匹配. 直接使用带花树即可. (带花树也是刚学)... 马上写带花树的ppt,会很通俗易懂. (充分证明了本苣智商不够,写不出高深的课件) 如果有想要 ...