js jq シングルクリックとダブルクリックの区別例 入門_基礎知識

1: 原則:

まずクリック イベントの実行シーケンスを見てみましょう:

クリック (クリック): マウスダウン、マウスアウト、クリック
ダブルクリック (dblclick) ) : マウスダウン、マウスアウト、クリック、マウスダウン、マウスアウト、クリック、dblclick;

ダブルクリック イベント (dblclick) では、トリガーされる 2 つのクリック イベント (click) のうち、最初のクリック イベント (click) が実行されます。ブロックされますが、2度目はブロックされません。つまり、ダブルクリック イベント (dblclick) は、クリック イベント (click) の結果とダブルクリック イベント (dblclick) の結果を返します。ダブルクリック イベントの結果 (dblclick) と 2 つのクリック イベントの結果 (click) の代わりに。

この場合は、余分なクリックイベント（クリック）を削除するだけで問題は解決します。

setTimeout

2: コード:

コードをコピー コード以下のように:

// setTimeout 実行メソッドを定義します。
var TimeFn = null;

$('div').click(function () {
//最後の遅延中に実行されなかったメソッドをキャンセルします
clearTimeout(TimeFn);
//実行遅延
TimeFn = setTimeout(function(){
//ここに関数がクリックイベントを書き込みます 実行されたコード
},300);
});

$('div').dblclick(functin () {
// 最後の遅延中に実行されなかったメソッドをキャンセルします
clearTimeout(TimeFn);
//ダブルクリックイベントの実行コード
})