删除选中的元素div

Question

我遇到了jquery remove()的问题：

function removeVendor(e){
e.remove("div.jumbotron");
}

    <!-- this 1 div -->
<div class="jumbotron in_hanca">
  <div class="col-md-6">
    <div class="form-group">
      <label class="col-md-5 control-label">Nama Vendor</label>
      <div class="col-md-7">
        <select name="nama_vendor[]" class="form-control" required="">
          <option value="">--Pilih Vendor--</option>
           
        </select>
      </div>
    </div>
  </div>
  <div class="col-md-4">
    <div class="form-group">
      <label class="col-md-4 control-label">Jumlah</label>
      <div class="col-md-8">
        <input type="text" class="form-control" name="jumlah_di_vendor[]" required="">
      </div>
    </div>
  </div>
  <div class="col-md-2">
    <button onclick="addVendor()" type="button" class="btn_tambah_vendor">add</button>
    <button onclick="removeVendor(this)" type="button" class="btn_kurangi_vendor">remove</button>
  </div>
</div>

<br>
<br>

<!-- this 2 div -->
<div class="jumbotron in_hanca">
  <div class="col-md-6">
    <div class="form-group">
      <label class="col-md-5 control-label">Nama Vendor</label>
      <div class="col-md-7">
        <select name="nama_vendor[]" class="form-control" required="">
          <option value="">--Pilih Vendor--</option>
           
        </select>
      </div>
    </div>
  </div>
  <div class="col-md-4">
    <div class="form-group">
      <label class="col-md-4 control-label">Jumlah</label>
      <div class="col-md-8">
        <input type="text" class="form-control" name="jumlah_di_vendor[]" required="">
      </div>
    </div>
  </div>
  <div class="col-md-2">
    <button onclick="addVendor()" type="button" class="btn_tambah_vendor">add</button>
    <button onclick="removeVendor(this)" type="button" class="btn_kurangi_vendor">remove</button>
  </div>
</div>

如果我点击按钮删除，它只是删除按钮而不是div.jumbotron全部如何修复它？ 。 **这个文字假人允许代码**“Lorem ipsum dolor sit amet，consectetur adipiscing elit。Sed pharetra tortor nisi，scelerisque vehicula orci accumsan vel.Etiam placerat，velit quis blandit rutrum，sem nisi hendrerit ligula，eget finibus dui velit accumsan ipsum.Donec neque justo，ornare non gravida vitae，condimentum et purus.Mauris vestibulum neque arcu，“

Answer 1

＆＃13;

＆＃13;

$('.btn_kurangi_vendor').click(function() {
  //$(this).closest('.jumbotron').css('border','2px solid red');
  $(this).closest('.jumbotron').remove();
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="jumbotron in_hanca">
  <div class="col-md-6">
    <div class="form-group">
      <label class="col-md-5 control-label">Nama Vendor</label>
      <div class="col-md-7">
        <select name="nama_vendor[]" class="form-control" required="">
          <option value="">--Pilih Vendor--</option>
           
        </select>
      </div>
    </div>
  </div>
  <div class="col-md-4">
    <div class="form-group">
      <label class="col-md-4 control-label">Jumlah</label>
      <div class="col-md-8">
        <input type="text" class="form-control" name="jumlah_di_vendor[]" required="">
      </div>
    </div>
  </div>
  <div class="col-md-2">
    <button onclick="addVendor()" type="button" class="btn_tambah_vendor">add</button>
    <button type="button" class="btn_kurangi_vendor">remove</button>
  </div>
</div>

<br>
<br>

<!-- this 2 div -->
<div class="jumbotron in_hanca">
  <div class="col-md-6">
    <div class="form-group">
      <label class="col-md-5 control-label">Nama Vendor</label>
      <div class="col-md-7">
        <select name="nama_vendor[]" class="form-control" required="">
          <option value="">--Pilih Vendor--</option>
           
        </select>
      </div>
    </div>
  </div>
  <div class="col-md-4">
    <div class="form-group">
      <label class="col-md-4 control-label">Jumlah</label>
      <div class="col-md-8">
        <input type="text" class="form-control" name="jumlah_di_vendor[]" required="">
      </div>
    </div>
  </div>
  <div class="col-md-2">
    <button onclick="addVendor()" type="button" class="btn_tambah_vendor">add</button>
    <button type="button" class="btn_kurangi_vendor">remove</button>
  </div>
</div>

＆＃13;

＆＃13;

＆＃13;

Answer 2

尝试以下脚本

Javascript ：

＆＃13;

＆＃13;

function removeThis(elem){
 elem.parentElement.remove()
}

＆＃13;

<div class='div'>
      some element <button onclick="removeThis(this)">remove element</button>
      </div>
    <div class='div'>
      some element <button onclick="removeThis(this)">remove element</button>
      </div>
    <div class='div'>
      some element <button onclick="removeThis(this)">remove element</button>
      </div>

＆＃13;

＆＃13;

＆＃13;

Jquery ：

＆＃13;

＆＃13;

$('.div button').click(function(){
$(this).parent().remove();
})

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<div class='div'>
  some element <button >remove element</button>
  </div>
<div class='div'>
  some element <button >remove element</button>
  </div>
<div class='div'>
  some element <button >remove element</button>
  </div>

＆＃13;

＆＃13;

＆＃13;

Answer 3

<script>
function removeThis(e) {
            $(e).parent().remove("div.div");            
        }
</script>

<div class='div'>
        some element <button onclick="removeThis(this)">remove element</button>
    </div>                   
    <div class='div'>        
        some element <button onclick="removeThis(this)">remove element</button>
    </div>                   
    <div class='div'>        
        some element <button onclick="removeThis(this)">remove element</button>
    </div>