web-dev-qa-db-ja.com

イベントでjQueryを使用してクリックされた要素を取得しますか？

次のコードを使用して、動的に生成されたボタンがクリックされたことを検出しています。

$(document).on("click",".appDetails", function () {
    alert("test");
});

通常、$('.appDetails').click()を実行しただけであれば、$(this)を使用してクリックされた要素を取得できます。上記のコードでこれをどのように達成できますか？

例えば：

$(document).on("click",".appDetails", function () {
    var clickedBtnID = ??????
    alert('you clicked on button #' + clickedBtnID);
});
jqueryevent-handlingclickjquery-events
64
Scott Beeson

できる限りシンプルに

ここでも$(this)を使用します

$(document).on("click",".appDetails", function () {
   var clickedBtnID = $(this).attr('id'); // or var clickedBtnID = this.id
   alert('you clicked on button #' + clickedBtnID);
});
79
bipen

関数のイベントパラメータがありません。

$(document).on("click",".appDetails", function (event) {
    alert(event.target.id);
});
35
Bastian Rang

これを処理する従来の方法は、ES6ではうまく機能しません。代わりにこれを行うことができます：

$('.delete').on('click', event => {
  const clickedElement = $(event.target);

  this.delete(clickedElement.data('id'));
});

イベントターゲットはクリックされた要素になりますが、これは必要な要素ではない場合があります（イベントを受け取った子の場合もあります）。実際の要素を取得するには：

$('.delete').on('click', event => {
  const clickedElement = $(event.target);
  const targetElement = clickedElement.closest('.delete');

  this.delete(targetElement.data('id'));
});
19
waffleau