Question

我有克隆和更改的问题。

＆＃13;

$(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();
});

function showModel(id){
if(id === ''){
$("input[name=show]").val("");
}else if(id === "1"){
$("input[name=show]").val("foo");
}else if(id === "2"){
$("input[name=show]").val("bar");
}else{
$("input[name=show]").val("too");
}
}

＆＃13;

<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 onchange='showModel(this.value)' 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>
      <input type='text' name='show'>
    </div>
  </div>
  <div class='target_clone'>
  </div>

</body>

＆＃13;

当我克隆数据时，它会显示很多选择框。当我选择选择框时，我想要从<input type='text' name='show'>按值更改if else。我该怎么办？

虚拟文字：Lorem ipsum dolor sit amet，consectetur adipiscing ELIT。在lectus orci的Phasellus。 Quisque maximus hendrerit consequat。 Donec blandit facilisis est。整数ac massa vitae ante vulputate sagittis nec at nisl。 Cras坐在一起，一个人，一个人，一个人 ac nulla。在erat aliquet hendrerit的Duis porta nisl。整数mollis 非odi et pellentesque。 Lorem ipsum dolor坐在amet，consectetur adipiscing elit。 Suspendisse cursus fringilla sem，facilisis malesuada orci varius in.Nullam tristique nisi sed sem mattis，a finibus magna 油树。 Fusce erat sem，semper ac vulputate sit amet，imperdiet sagittis ex

Answer 1

执行以下操作：在克隆后清除输入，在更改时选择相对于选择的显示输入：

$(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:last").find("input[name=show]").val('');
  //        $(".barang_in_clone:has(select)").addClass("select2");
}

$('body').on('click', '.btn_kurangi_barang', function() {
  $(this).closest('.barang_in_clone').remove();
});

function showModel(el){
if(el.value === ''){
$(el).siblings("input[name=show]").val("");
}else if(el.value === "1"){
$(el).siblings("input[name=show]").val("foo");
}else if(el.value === "2"){
$(el).siblings("input[name=show]").val("bar");
}else{
$(el).siblings("input[name=show]").val("too");
}
}

<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 onchange='showModel(this)' 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>
      <input type='text' name='show'>
    </div>
  </div>
  <div class='target_clone'>
  </div>

</body>

Answer 2

试试这个：https://jsfiddle.net/9t01777r/

HTML

<div class="hidden_input" style="display: none">
      <div class="barang_in">
         <label class="col-md-4 control-label">Kode Hanca</label>
         <select onchange='showModel(this)' 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 onclick="removeBarang(this)" 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>
         <input type='text' name='show'>
      </div>
   </div>
   <div class='target_clone'>
   </div>

的Javascript

var addBarang = function() {
   var new_barang = $(".hidden_input").find(".barang_in").clone(true).addClass("barang_in_clone");
   $(".target_clone").append(new_barang);
   //          $(".barang_in_clone:has(select)").addClass("select2");
}
var showModel = function(obj) {
   var id = $(obj).val();
   if (id === '') {
      $(obj).closest('.barang_in').find('input[name=show]').val("");
   } else if (id === "1") {
      $(obj).closest('.barang_in').find('input[name=show]').val("foo");
   } else if (id === "2") {
      $(obj).closest('.barang_in').find('input[name=show]').val("bar");
   } else {
      $(obj).closest('.barang_in').find('input[name=show]').val("too");
   }
}

var removeBarang = function(ths) {
   $(ths).closest('.barang_in_clone').remove();
}
$(function() {
   addBarang();
});

clone和selectbox onchange更改输入文本的值

2 个答案: