jquery找到最近的类并删除它

Question

如果点击了特定的list_product类，我试图删除delete整个块。我对jquery很新，还在学习。

<div class='list_product'>
    <div class='row'>
        <div class='delete'>x</div>
        <div class='title'>Standing Fan</div>
     </div>
</div>
<div class='list_product'>
    <div class='row'>
        <div class='delete'>x</div>
        <div class='title'>Standing Fan 2</div>
     </div>
</div>
<div class='list_product'>
    <div class='row'>
        <div class='delete'>x</div>
        <div class='title'>Standing Fan 3</div>
     </div>
</div>
<div class='list_product'>
    <div class='row'>
        <div class='delete'>x</div>
        <div class='title'>Standing Fan 4</div>
     </div>
</div>

Jquery的：

$('.delete').click(function() {
   $(this).find('.list_product').remove();
});

不工作。我可以知道为什么以及如何解决这个问题？感谢

Answer 1

做$(this).closest('.list_product').remove() API ref：http://api.jquery.com/closest/
find搜索当前元素的子元素。在这种情况下，.delete元素没有任何子元素。相反，closest通过DOM up ，寻找具有类list_product的第一个祖先。希望这会有所帮助。

Answer 2

试试这个：

$(document).on('click', '.delete', function(e) {
   e.preventDefault();
   $(this).closest('.list_product').remove();
   return false;
});

Answer 3

您可以在父元素上使用event delegation或使用Closest方法

最近很容易使用：

var id = $("button").closest("div").attr("id");