JQuery如何实现双击事件时不触发单击事件

Posted wxh27

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了JQuery如何实现双击事件时不触发单击事件相关的知识,希望对你有一定的参考价值。

单击和双击事件的执行顺序:

       单击(click):mousedown,mouseout,click;
  双击(dblclick):mousedown,mouseout,click , mousedown,mouseout,click,dblclick;

在双击事件(dblclick),触发的两次单击事件(click)中,第一次的单击事件(click)会被屏蔽掉,但第二次不会。也就是说双击事件(dblclick)会返回一次单击事件(click)结果和一次双击事件(dblclick) 结果。而不是一次双击事件(dblclick)结果和两次单击事件结果(click)。  

  如此这般的话,只需消灭掉多余的一次单击事件(click),这个问题就解决了。

 

//定义setTimeout执行方法
var time = null;

$(‘div‘).click(function () {
    // 取消上次延时未执行的方法
    clearTimeout(time);
    //执行延时
    time = setTimeout(function(){
        //do function在此处写单击事件要执行的代码
    },300);
});

$(‘div‘).dblclick(functin () {
    // 取消上次延时未执行的方法
    clearTimeout(time);
    //双击事件的执行代码
});

以上是关于JQuery如何实现双击事件时不触发单击事件的主要内容,如果未能解决你的问题,请参考以下文章

双击和单击事件冲突解决方法

双击和单击事件冲突解决方法

双击和单击事件冲突解决方法

jquery双击事件(dblclick)时,不触发单击事件(click)

JQuery解决鼠标单双击冲突问题

js中如何禁止滚轮的单击?