Jquery动态元素选择器

Jquery dynamic element selector

本文关键字：选择器 元素 动态 Jquery      更新时间：2024-03-07

我知道这个问题已经得到了很多回答，但当我将这个解决方案应用于动态创建的元素时，事件绑定？选择器选择所有元素并仅检索第一个元素

$('body').on('click','a.delete',function() {
   var id = $('a.delete').attr('id');
   var par = $('a.delete').closest('.foo');
   console.log(id);
   par.hide();
   postDelete(id);
});

.foo是a.delete的父元素
该代码隐藏了.foo类的所有元素，并删除了a.delete类的第一个元素，而不是单击的

如何检索我单击的元素的ID并隐藏其父元素？

您应该在点击事件中使用this而不是a.delete来获得点击的a.delete的引用，如下所示。

$('body').on('click', 'a.delete', function () {
    var id = $(this).attr('id'); //change here
    var par = $(this).closest('.foo'); //change here
    console.log(id);
    par.hide();
    postDelete(id);
})

使用this获取clicked元素。

从docs，除了事件对象，事件处理函数还可以通过关键字this访问处理程序绑定到的DOM元素

$('body').on('click', 'a.delete', function() {
  var id = $(this).attr('id');
  var par = $(this).closest('.foo');
  console.log(id);
  par.hide();
  postDelete(id);
});
相关文章：