jQueryを使用してマウスのダブルクリックを避ける

紹介する

ユーザがDOMオブジェクト(ボタンやリンクなど)をダブルクリックすると、ユーザのインタラクションは常に面倒な問題となる.幸いなことに、jQueryはかなり素晴らしい解決方法を提供しています.それはone().

　　.one()この方法は何をしますか?

要素イベントのハンドラが追加され、各要素はイベントプロセッサ関数を1回しか実行できません.

パラメータ

　　.one( events [, selector ] [, data ], handler(eventObject) )

　　events

タイプ:String

は、要素に追加された1つまたは複数のイベントを規定する.複数のイベントをスペースで区切ります.有効なイベントでなければなりません.「click」と「keydown.myPlugin」のように.

セレクタパラメータ

パラメータタイプ:String

セレクタ文字列は、選択された要素の中でイベントをトリガ可能なサブ要素

をフィルタリングするために使用される.

nullまたは省略が送信されると、イベントが選択する要素に到達すると

がトリガーされる.

データ#データ#

パラメータタイプ:任意のタイプ

このパラメータの値は、イベントトリガによって伝達するイベント処理関数

である.

イベント処理関数

パラメータタイプぱらめーたたいぷ:関数タイプかんすうたいぷ

イベントトリガ時に呼び出すべき関数

falseも簡単なreturn falseであるため許容される.関数の省略形

例を挙げる

$("#saveBttn").one("click", function () {
    alert("This will be displayed only once.");
});

または

$("body").one("click", "#saveBttn", function () {
    alert("This displays if #saveBttn is the first thing clicked in the body.");
});

上記のコードのキーは、次のとおりです.

コードの実行が終了すると、idがsaveBtnの要素をクリックすると、警告ボックス

がポップアップする.

以降のクリックは

を反映しません.

=>

$("#saveBttn").on("click", function (event) {
    alert("This will be displayed only once.");
    $(this).off(event);
});

すなわち、バインドイベント処理関数においてoff()を明示的に呼び出す役割と同様である

詳細については、

　　 jQuery .one() 

まとめ

上記の方法はjQuery 1.7の新しい特性なので、要素クリックイベントが一度だけトリガーされない場合は、解決策かもしれません.どんなに不思議な方法なのか、何か質問があれば連絡してください.
原文:How-to-Avoid-Double-Clicking-With-jQuery