美文网首页
js单击双击事件冲突问题

js单击双击事件冲突问题

作者: 塞风 | 来源:发表于2019-12-28 16:13 被阅读0次

解决同一元素上的单击双击冲突问题

先上代码:

代码实现

实现思路:双击button元素(在250ms内,简写为btn),其实btn会连续执行2次单击事件,即btn单击事件中的setTimeout会执行2次,会产生两次timer。我们的目的不输出1,而是输出2,那么就需要把两次生成的timer的延时函数清空掉就不会输出1了。2次连续单击事件中,第一次执行后生成的了timer被第二次执行清除掉,第二次执行生成的timer,如果没被清除会在250ms后输出1,那么次时刚好是一个双击事件的收割(执行)时机,双击事件中刚好又把第二次单击事件生成的timer清除掉了,就把第二次的延时函数被清理掉不会输出1了,接着控制台打印2,达到效果。

注意:该方法并不完全能抑制单击事件中代码的执行,建议还是不要在同一元素上同时绑定单击双击事件,如果可以将双击事件换为鼠标右键点击事件。

相关文章

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

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

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

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

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

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

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

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

  • iOS单击和双击冲突事件

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

  • js基本事件

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

  • 事件捕捉

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

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

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

  • 五、jQuery事件

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

  • jQuery系列(四) -- 事件

    鼠标事件 .click() ==> 单击事件 .dblclick() ==> 双击事件 .mousedown() ...

网友评论

      本文标题:js单击双击事件冲突问题

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