jquery - 单击删除父 div

Question

我正在尝试在单击链接时删除 div。问题是相同的 div 和链接有多个结构，我尝试制作一个函数，但它删除了所有 div

$(document).on("click", ".fd-bxx-cls", function(e) {
  e.preventdefault;
  $(this).parents('.fd-box2').fadeOut(300);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="fd-box2">
  <div class="fd-box3">
    <a href="#" class="fd-bxx-cls"></a>
    <a class="fd-avtar-s" href="#"><img src="images/avatr_s.png" /></a>
    <div class="fd-nme-info">
      <span class="fd-mn-ttl">Robert Porter</span>
      <span class="fd-mncn-ttl">Pheonix, AZ</span>
    </div>
    <a href="#" class="ep-btns fd-msg-btn"></a>
  </div>
</div>

Answer 1

淡出祖父母应该工作。

$(this).parent().parent().fadeOut(300);

另一种可能性是使用.closest().

$(this).closest(".fd-box2").fadeOut(300);

Answer 2

您应该使用最接近（）方法而不是parents()。请参阅文档中的差异。

此外，如果您想删除一个元素（而不仅仅是隐藏它），请使用remove()方法。