JQuery单击使用Ajax添加的元素[重复]答案

【问题标题】：JQuery click for elements added using Ajax [duplicate]JQuery单击使用Ajax添加的元素[重复]
【发布时间】：2014-10-23 19:34:34
【问题描述】：

我有一个带有 c 类的 div，我正在使用 Ajax 向这个类添加一些代码，所以它最终看起来像：

<div class="c">
  <div class="del" id="1"></div>
  <div class="del" id="2"></div>
  <div class="del" id="3"></div>
</div>

我的 c 类是静态的，而 delete 类的 div 是使用 Ajax 添加的。现在我想要的是获取我点击的类 delete 的 div 的 id。

我最初是这样做的：

$(".delete").click(function(){
    var id = $(this).attr('id');
    }
);

但这不起作用。后来我在 SO 上发现我们应该使用 .on() 来处理使用 Ajax 添加的内容。据我了解，我是这样实现的：

$(".c").on('click','.delete',function(){
    var id = $(".delete").attr('id');
    }
);

但这给了我第一次删除的id。有人可以提供一种方法，以便我可以得到我点击的删除的id，假设内部div，即：

<div class="del" id=i></div>

使用 Ajax 添加。谢谢。

【问题讨论】：

标签： jquery ajax

【解决方案1】：

您不必使用$('.delete') 再次重新选择.delete 集合。 .attr 方法作为元素集合的 getter 调用，返回集合中第一个元素的属性值。在您的情况下，您已经将当前单击的元素引用为this。试试这个：

$(".c").on('click','.delete', function() {
    var id = this.id;
});

您还可以将id 作为 HTMLElement 属性访问，因此您无需读取其属性。

【讨论】：