Question

我有这段代码：

   <div class="container">
    <div class="row">
      <div class="col">
        <a href="1" class="delete_activity">x</a> 
      </div>
    </div>  
    <div class="row">
      <div class="col">
        <a href="2" class="delete_activity">x</a> 
      </div>
    </div>  
    <div class="row">
      <div class="col">
        <a href="3" class="delete_activity">x</a> 
      </div>
    </div>  
  </div>

点击“delete_activity”后，我需要删除具有该链接的“row”div。在用户点击X（href = 1）的情况下，我需要删除：

    <div class="row">
      <div class="col">
        <a href="1" class="delete_activity">x</a> 
      </div>
    </div>

我怎样才能使用JQuery？

Answer 1

执行此操作的最佳方法是使用closest()。

$('.delete_activity').click(function(){
    $(this).closest('.row').remove();
});

不要使用parents（除非那是你想要的行为）。

closest只会删除在DOM树中找到的第一个元素。

parents将删除与DOM树匹配的所有元素。

Answer 2

$('.delete_activity').click(function(){
    $(this).parents('.row').remove();
});

文档：http://api.jquery.com/remove/

Answer 3

$(".delete_activity").click(function(event) {
    event.preventDefault()
    $(this).parents('.row').remove();
});

Answer 4

尝试以下

$('.delete_activity').click(function (e) { 
  $(this).parents('div.row').remove();
  e.preventDefault();
});

Answer 5

$('.delete_activity').click(function(){
    $(this).parents('row:first').remove();
});

先使用以获得上面的第一个父母！

如何使用jquery删除div？

5 个答案: