解决同一元素上的单击双击冲突问题
先上代码:

实现思路:双击button元素(在250ms内,简写为btn),其实btn会连续执行2次单击事件,即btn单击事件中的setTimeout会执行2次,会产生两次timer。我们的目的不输出1,而是输出2,那么就需要把两次生成的timer的延时函数清空掉就不会输出1了。2次连续单击事件中,第一次执行后生成的了timer被第二次执行清除掉,第二次执行生成的timer,如果没被清除会在250ms后输出1,那么次时刚好是一个双击事件的收割(执行)时机,双击事件中刚好又把第二次单击事件生成的timer清除掉了,就把第二次的延时函数被清理掉不会输出1了,接着控制台打印2,达到效果。
注意:该方法并不完全能抑制单击事件中代码的执行,建议还是不要在同一元素上同时绑定单击双击事件,如果可以将双击事件换为鼠标右键点击事件。
网友评论