jquery双击事件

在开发过程中经常会遇到使用双击事件或者避免短时间内连续触发单击事件的逻辑。这里介绍一下对类似问题的处理方法。

####一、jquery的dblclick事件

一个DOM元素,如:div,既绑定了 click 事件,又绑定了 dblclick 事件,这两个事件分别要做独立的事情。事件处理上没有冲突,都可以各自 完成各自的操作。双击的时候虽然是执行了 dblclick 事件,但是在这之前,也执行了 click 事件

首先,来了解一下点击事件发生的先后顺序:
单击:mousedown, mouseup, click
双击:mousedown, mouseup, click, mousedown, mouseup, click, dblclick
  由此看来,dblclick 事件发生之前,实际上发生了两次 click 事件。其中,第一次的 click 是会被屏蔽掉,但是第二次则不会,所以就出现在双击的时候,也触发 click 事件。

解决的方法,可以参考下面的代码,用延时的方法实现:




  


  
  


注意:移动手机端不能触发jQuery的dblclick事件,例如:




####二、js仿双击事件
我们可以通过判断两次单击间隔时间来模拟dblclick双击事件,修改脚本如下:




你可能感兴趣的:(技术分享)