美文网首页
js中双击事件和单击事件冲突的解决

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

作者: 月下吴刚_c8c7 | 来源:发表于2018-10-11 18:18 被阅读0次

在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 事件的处理
}

相关文章

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

    在JS中代码中同一功能块中通常同时会用到单击、双击事件,但通常会遇到一个问题,就是在双击的时候即执行了一次双击事件...

  • 双击事件和单击事件冲突

    只要使用GestureDetector就能解决这个问题 单击事件写在onSingleTapConfirmed(ev...

  • js单击双击事件冲突问题

    解决同一元素上的单击双击冲突问题 先上代码: 实现思路:双击button元素(在250ms内,简写为btn),其实...

  • 单击事件和双击事件冲突问题

    同一个元素上,绑定多种事件类型,比较常见的是单击事件和一些鼠标事件,一般而言影响不大。但是如果同时绑定单击事件和双...

  • iOS单击和双击冲突事件

    //单击的Recognizer UITapGestureRecognizer*singleRecognizer; ...

  • 事件捕捉

    js中事件捕捉的案例代码 ,事件类型 onclick 表示鼠标单击的时候触发; ondblclick 表示鼠标双击...

  • 实现html/js同时启用单双击事件

    在同一个dom元素同时启用了单击和双击事件时,双击会触发两次单击事件和一次双击事件,并且触发顺序是:单击1 -> ...

  • js基本事件

    单击事件:onclick:单击事件ondbclick:双击事件 鼠标事件:onmousemove:鼠标移动事件on...

  • 【Axure10】交互功能-交互事件-元件(元件组)交互事件

    鼠标相关交互事件 【高】单击时 元件(元件组)的是鼠标单击事件,可以实现鼠标单击的触发的交互事件。 【中】双击事件...

  • 五、jQuery事件

    一、鼠标事件 1、鼠标点击 注意1、双击事件伴随着单击事件,因此双击事件会触发两次单击事件2、单击事件又伴随着mo...

网友评论

      本文标题:js中双击事件和单击事件冲突的解决

      本文链接:https://www.haomeiwen.com/subject/zifiaftx.html