javascript - マウスで DOM または jQuery 要素を取得するのは難しいですか?

Question

マウスクリックでDOMまたはjQuery要素を取得するには? たとえば、次のコードがあります。

$("*").mouseup(
 function() 
 {
    var clickedElement = ???????????????
 }
);

では、「clickedElement」変数を初期化する方法は? ありがとうございました。

Answer 1

イベント ハンドラー内で、thisイベントが発生した DOM 要素を参照します。

$("*").mouseup(function() {
    var clickedElement = this;
});

jQuery 要素を取得するには、 に渡すだけthisですjQuery。

ただし:すべての要素にイベント ハンドラーをバインドするのではなく、イベント委任を使用する方がはるかに優れています。次の方法でイベントの発生元を取得できます。event.target

$(document).mouseup(function(event) {
    var clickedElement = event.target;
});

さらに注意:これは必ずしもクリックされた要素ではなく、マウス ボタンが離された要素であり、ボタンが押された要素とは異なる可能性があります。イベントにバインドしたい場合がありclickます。

---

また、これらの基本がカバーされている jQuery チュートリアルを読むことをお勧めします。

Answer 2

すべての DOM 要素にイベントをアタッチしたくない場合 (お勧めしません)...

$(document).mouseup(function(event) {
   var clickedElement = event.target;
});

jsFiddle .

ここでは、任意の要素のイベントが まで泡立ちdocument、そこで処理され、イベントを開始した元の要素は になりますevent.target。

Answer 3

これを使用します。すなわち:

$("*").mouseup(  function()   {     
    var clickedElement = this; //HTML DOM Element
    var $clickedElement = $(this); //jQuery Wrapped HTML DOM Element
} );