js は click と dblclick events_javascript スキルの間の競合を不完全に解決します

状況の説明
div などの要素が click イベントと dblclick イベントの両方にバインドされており、これら 2 つのイベントが比較的独立したビジネスを処理する必要がある場合、つまり、クリック時に dblclick をトリガーできず、dblclick をトリガーできない場合。トリガークリック。実際のテストでは、dblclick を実行すると必ず 1 回のクリックが発生することがわかりました。以下で解決するのはこの問題です。
状況分析
まず、click と dblclick の実行順序を理解する必要があります。テスト プロセスは次のように省略されています。
クリック: マウスダウン -- マウスアップ -- クリック
dblclick: マウスダウン -- マウスアップ -- クリック -- マウスダウン -- マウスアップ -- クリック -- dblclick
この観点から、dblclick がトリガーされる前に、実際には 2 回のクリックが実行され、最初のクリックはブロックされます。 （なぜですか？まあ、私にもわかりません）。
解決策
まず思い浮かぶのはイベントを停止できるかどうかですが、ブラウザには対応するメソッドが用意されていないことがわかりました。クリックイベントをキャンセル可能にする必要があります。
そこで私は遅延の使用を検討しました。これが私が思いつく唯一の解決策でした。setTimeout() を使用してクリック イベントの処理の完了を遅らせ、その後、clearTimeout() を使用してクリックをブロックする必要があるときに停止します。
特定のコード

コードをコピー コードは次のとおりです。

var test = ( function() {
var clickText = 'click
';
var timer = null; ){
clearTimeout(timer);
timer = setTimeout(function(){
$('body').append(clickText);
},
}; 🎜>dblclick : function(){
clearTimeout(timer);
$('body').append(dblclickText);
},
init: function(){
$( function() {
$('div').click(test.click).dblclick(test.dblclick)
}
}
});
test.init();


html コード

コードをコピー

コードは次のとおりです

click
または
dblclick

フォローアップ

タイトルに記載の通りWindows では、マウスのダブルクリック速度はコントロール パネルで調整できるため (他のシステムについてはわかりません)、システム設定のダブルクリック速度をこれより遅いと、上記のデモは有効になりません。したがって、300 ミリ秒は単なる近似値です。
著者: フー・イールイ