在事件上使用jQuery获取clicked元素?

时间:2013-04-18 19:49:09

标签: javascript-events event-handling click jquery

我使用以下代码检测点击动态生成的按钮的时间。

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

通常,如果您刚刚$('.appDetails').click(),则可以使用$(this)来获取点击的元素。如何使用上面的代码完成此操作?

例如:

$(document).on("click",".appDetails", function () {
    var clickedBtnID = ??????
    alert('you clicked on button #' + clickedBtnID);
});

6 个答案:

答案 0 :(得分:73)

尽可能简单

此处也使用$(this)

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

答案 1 :(得分:32)

您缺少功能上的事件参数。

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

答案 2 :(得分:15)

传统的处理方式与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'));
});

答案 3 :(得分:1)

有很多方法可以做到这一点

<块引用> <块引用>

第一种方法是使用javascript目标

$(document).on("click",".appDetails", function (event) {
    var clickebtn = target.event.id;
});

答案 4 :(得分:0)

一种简单的方法是将data属性传递到HTML标记。

示例:

<div data-id='tagid' class="clickElem"></div>

<script>
$(document).on("click",".appDetails", function () {
   var clickedBtnID = $(this).attr('data');
   alert('you clicked on button #' + clickedBtnID);
});
</script>

答案 5 :(得分:-3)

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