1. 程式人生 > >JQuery如何實現雙擊事件時不觸發單擊事件

JQuery如何實現雙擊事件時不觸發單擊事件

art 屏蔽 settime 事件 順序 tin on() () 延時

單擊和雙擊事件的執行順序:

單擊(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如何實現雙擊事件時不觸發單擊事件