在克隆后的 child 中添加 class

Question

我想在克隆后在 child 中添加类。我想添加 class select2，因为当我也克隆 select2 时，它没有响应。

$(document).ready(function() {
  addBarang();
});

function addBarang() {
  var new_barang = $(".hidden_input").find(".barang_in").clone().addClass("barang_in_clone");
  $(".target_clone:last").append(new_barang);
  //        $(".barang_in_clone:has(select)").addClass("select2");
}

$('body').on('click', '.btn_kurangi_barang', function() {
  $(this).closest('.barang_in_clone').remove();
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<body>
  <div class="hidden_input" style="display: none">
    <div class="barang_in">
      <label class="col-md-4 control-label">Kode Hanca</label>
      <select name="id_vendor_detail" class="form-control" required="">
        <option value="">- PILIH -</option>
        <option value="1">- Orange -</option>
        <option value="2">- Pink -</option>
        <option value="3">- Red -</option>

      </select>
      <button onclick="addBarang()" type="button" data-toggle="tooltip" data-placement="top" title="tambah vendor" class="btn btn-info btn-flat btn-xs pull-left btn_tambah_vendor"><i class="fa fa-plus"></i> add</button>
      <button type="button" data-toggle="tooltip" data-placement="top" title="kurangi barang" class="btn btn-danger btn-flat btn-xs pull-right btn_kurangi_barang"><i class="fa fa-minus"></i> Remove</button>
    </div>
  </div>
  <div class='target_clone'>
  </div>

</body>

如何在select中添加classselect2？

//dummy text : 客户应该非常小心，客户会被跟踪。在病床上的船。每局最重要的结果。很容易受宠若惊。在 vulputate sagittis 之前或在 nisl 之前的整个生命。明天会很有趣，不会害怕 eleifend 的成员。机场门口停着卡车中的亨德里特。完全柔软而不可恨。客户很重要，客户会跟着客户走。 fringilla sem 最重要的课程，在医院等待很容易。没有悲伤，只是沙拉的末端很软。这是 fusce sem, always and vulputate be amet, imperdiet sagitt ex

Answer 1

使用 $(".barang_in_clone select").addClass("select2"); select 或者您可以在克隆 HTML 的 select 中添加 class。

请查看下面的代码片段以便更好地理解。

$(document).ready(function() {
  addBarang();
});

function addBarang() {
  var new_barang = $(".hidden_input").find(".barang_in").clone().addClass("barang_in_clone");
  $(".target_clone:last").append(new_barang); 
  $(".barang_in_clone select").addClass("select2");
  $(".select2").select2();
}

$('body').on('click', '.btn_kurangi_barang', function() {
  $(this).closest('.barang_in_clone').remove();
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.3/css/select2.min.css" rel="stylesheet" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.3/js/select2.min.js"></script>
<body>
  <div class="hidden_input" style="display: none">
    <div class="barang_in">
      <label class="col-md-4 control-label">Kode Hanca</label>
      <select name="id_vendor_detail" class="form-control" required="">
        <option value="">- PILIH -</option>
        <option value="1">- Orange -</option>
        <option value="2">- Pink -</option>
        <option value="3">- Red -</option>

      </select>
      <button onclick="addBarang()" type="button" data-toggle="tooltip" data-placement="top" title="tambah vendor" class="btn btn-info btn-flat btn-xs pull-left btn_tambah_vendor"><i class="fa fa-plus"></i> add</button>
      <button type="button" data-toggle="tooltip" data-placement="top" title="kurangi barang" class="btn btn-danger btn-flat btn-xs pull-right btn_kurangi_barang"><i class="fa fa-minus"></i> Remove</button>
    </div>
  </div>
  <div class='target_clone'>
  </div>

</body>

Answer 2

改为使用

var new_barang = $(".hidden_input").find(".barang_in").clone().addClass("barang_in_clone");

试试这个

var new_barang = $(".hidden_input").find(".barang_in").clone();
new_barang.addClass("barang_in_clone");
$(".target_clone:last").append(new_barang);

它会起作用:-)

在克隆后的 child 中添加 class

add class in child after clone

jquery

clone

select2