单击按钮时如何选择按钮并删除该按钮的祖父 div？答案

【问题标题】：How to select a button and delete a grandparent div of that button when the button is clicked?单击按钮时如何选择按钮并删除该按钮的祖父 div？
【发布时间】：2014-12-19 13:42:56
【问题描述】：

这是我的代码。

    $(document).ready(function(){
        $(".btn.btn-default.btn-lg.remove").click(function(){ 
            $(this).parent().remove();
        });
    });

      <div class="row lead"  style="margin-left:100px;color:red">
           <div class="col-md-2"><span style="color:red></div>
           <div class="col-md-2"><span style="color:red"></div>
           <div class="col-md-2"><span style="color:red"></div>
           <div class="col-md-2"><span style="color:red"></div>
               <div class="col-md-3">
                    <button type="button" class="btn btn-default btn-lg remove"> </button> 
                    <button type="button" class="btn btn-default btn-lg"></button>    
                    <button type="button" class="btn btn-default btn-lg"></button>
               </div>
      </div>

我希望在单击 class="btn btn-default btn-lg remove" 的按钮时删除整个 div。我不能使用 id，因为我正在使用 append jquery 动态附加上面的 div。

【问题讨论】：

标签： javascript jquery twitter-bootstrap

【解决方案1】：

您可以使用closest

$(document).ready(function(){
    $(".btn.btn-default.btn-lg.remove").click(function(){ 
        $(this).closest('.row').remove();
    });
});

【讨论】：

【解决方案2】：

我猜你只是想提高一级？这会删除整个 div “行前导”。

$(document).ready(function(){
       $(".btn.btn-default.btn-lg.remove").click(function(){ 
       $(this).parent().parent().remove();
     });
  });

【讨论】：

【解决方案3】：

在 jquery 中使用 closest()

 $(document).ready(function(){
     $(".btn.btn-default.btn-lg.remove").click(function(){ 
             $(this).closest(".row.lead").remove();
     });
});

【讨论】：