克隆和选择框onchange输入文本的更改值

我有克隆和更改问题。克隆和选择框onchange输入文本的更改值

$(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"); 
 
} 
 
}

<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>

当我克隆的数据，其显示出许多选择框。当我选择选择框时，我想要根据if else的值更改<input type='text' name='show'>。我能怎么做？

dummy text : Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus at lectus orci. Quisque maximus hendrerit consequat. Donec blandit facilisis est. Integer ac massa vitae ante vulputate sagittis nec at nisl. Cras sit amet sem nec metus sodales eleifend a ac nulla. Duis porta nisl in erat aliquet hendrerit. Integer mollis non odio et pellentesque. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse cursus fringilla sem, facilisis malesuada orci varius in. Nullam tristique nisi sed sem mattis, a finibus magna mollis. Fusce erat sem, semper ac vulputate sit amet, imperdiet sagittis ex

来源

2016-09-30 wawan Setiyawan

请运行该片段 –

与虚拟文字是什么？ – madalinivascu

输入值在更改selectbox选项时确实发生了变化，最新的问题实际上是 –

执行以下操作：克隆后清除输入，在改变选择的节目输入，是相对于选择：

$(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>

来源

2016-09-30 04:16:29 madalinivascu

是的，它对我这样的初学者非常有帮助..谢谢madalin –

家伙，为什么如果我组合它与Ajax使浏览器挂起？我添加了像这样的阿贾克斯： –

function showModel（el）{el ===“”）{ $（el）.siblings（“input [name = model]”）。val（“”）; }其他{ $阿贾克斯（{ 网址： 'vendor_inout/vendor_inout_crud.php'，类型： 'POST'，数据类型： 'JSON'，数据：{id_vendor_detail：EL，键入： “get_model”}， //获取模型dan ukuran –

试试这个：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(); 
});

来源

2016-09-30 04:40:21

克隆和选择框onchange输入文本的更改值

回答

相关问题