web-dev-qa-db-ja.com

jQueryを使用して実行されたクリックをキャッチする

それを行うためのnoobの方法は私が推測するでしょう

$('*').click(function(){...});

しかし、DOM内のすべてのオブジェクトのリスナーを登録しなくても、あらゆるタイプのクリックをキャッチできる方法はありますか？

ヘルプは素晴らしいでしょう。 =）

javascriptjquerydomjavascript-eventsonclick
28
RadiantHex

clickイベントはデフォルトで DOMのバブル になるため、次のようにclickハンドラーをルートにアタッチするだけです。

_$(document).click(function() {
  //do something
});
_

途中の要素のハンドラーが event.stopPropagation() または_return false_を実行しない限り、ここをクリックできます。

32
Nick Craver

ドキュメントでイベント委任を使用して、すべてのクリックをキャッチできます。

jQueryはtargetのeventプロパティを入力して、クリックされた要素を取得します。

_$(document).click(function(event){
  // event.target is the clicked object
});
_

_event.target_がクリックされた最も深い要素になることに注意してください。例：_<span>_に_<a>_がある場合、_<span>_ではなく_<a>_を取得します。

クリックをキャッチしたいが特定の要素（クラスなど）を取得したい場合は、次のようにします。

_$(document).click(function(event){
  $(event.target).closest(".clickable").each(function(){
    // "this" is your "clickable" clicked
  });
});
_

途中の要素のイベントハンドラーが event.stopPropagation() または_return false_を実行しない限り、ここをクリックできます。

17
Vincent Robert

本体にカチッと付けるだけではどうですか？

$('body').click(function(e){ ... })

e.targetには、クリックされたものが含まれている必要があります

4
Mottie

$('*').click( function() {...} )は、.click()を呼び出したときに存在していた要素のクリックのみをキャッチします。後で作成される可能性のある要素のクリックをキャッチするには、他の人が示唆しているように、bodyまたはdocumentにバインドする必要があります。

4
jasongetsdown

どうですか：

$('body').click(function(){...});

これはdom内のすべての可視ノードの親であるため、ボディをクリックするとすべてクリックされます。

3
pkaeding