js中双击事件和单击事件冲突的解决

在JS中代码中同一功能块中通常同时会用到单击、双击事件,但通常会遇到一个问题,就是在双击的时候即执行了一次双击事件,而且还执行了两次单击事件。此类冲突在ZTree、DHTMLX中经常遇到。
想要解决两个事件冲突,需要对单击事件进行延时,如果在此延时中又监测到单击事件,那么认为此两次单击属于一个双击事件,则只执行双击事件,并第一时间将延时定时器清理,以防止第二次单击生效。

var delay= null;   // 两个点击事件之外的延时器变量
function click( ) {  // 单击事件回调
  if(delay) {  // 如果是双击时清除第一次单击的操作,仅仅单击不会进入此判断
    clearTimeout(delay);
  }
  delay= setTimeout(function() {
    // click 事件的处理
  }, 400);//大于300毫秒即可
}
 
function DblClick(...) {    // 双击事件回调
  if(delay) {      // 双击时清除第二次单击时的操作,进入双击操作
    clearTimeout(delay);
  }
  // dblclick 事件的处理
}
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

  •   JavaScript 与 HTML 之间的交互是通过事件实现的。   事件,就是文档或浏览器窗口中发生的一些特...
    霜天晓阅读 8,907评论 1 11
  • 国家电网公司企业标准(Q/GDW)- 面向对象的用电信息数据交换协议 - 报批稿:20170802 前言: 排版 ...
    庭说阅读 14,029评论 6 13
  • 在我小时候,我们村里好多爷爷奶奶都喜欢我,因为我是那种家长眼里的乖孩子。我也特别喜欢这些老人家,他们笑容可鞠和...
    松楼阅读 2,087评论 0 0
  • 谈过恋爱吗?我身边的大多数姑娘都含过爱情蜜糖,滋润的面颊绯红、目光痴醉。Z姑娘,我的高中室友,性格开朗,大大咧咧,...
    子兔君阅读 4,695评论 0 3
  • 共修功课第十天:培德养德才能让我们的能量提升,练习,找一个事情练习自己的转念,学会调整内在信息,体察那个能量的变化...
    李七万阅读 3,101评论 1 0

友情链接更多精彩内容