根據數值字段中的值添加或刪除元素

-1

$("#add_row").change(function(){ 
 

 
    $(".box").append('test <br />'); 
 

 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input class="form-control input-sm" id="add_row" type="number"> 
 
    
 
<div class="box"></div>

現在我想添加或刪除號碼字段

來源

2017-09-13 Khirad Banu

隱藏/顯示比追加/刪除更容易。還基於什麼數字？你沒有在這裏給出邏輯 - 甚至你自己做了任何嘗試。 –

我覺得hide/show不適合這裏，因爲用戶可以輸入任何數字值。 –

...做什麼？你沒有解釋你想要做什麼 –

我已經追加所以沒有必要擔心降低值

注意之前清空了box確定您的要求，但它可以用不同的方式來完成）

$("#add_row").change(function(){ 
 
\t var total = $(this).val(); 
 
\t var oldLength = $(".box > span").length; 
 
\t var change = total - oldLength; 
 
\t if (change > 0) { 
 
\t \t for (i = 0; i < change; i++) { 
 
\t \t \t $(".box").append('<span >test <br /></span>'); 
 
\t \t } 
 
\t } 
 
\t else { 
 
\t \t change = Math.abs(change) 
 
\t \t $(".box > span").each(function(index) { \t \t \t \t 
 
\t \t \t $(this).remove(); 
 
\t \t \t if (index == (change -1)) { 
 
\t \t \t \t return false; 
 
\t \t \t } 
 
\t \t }); 
 
\t } 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input class="form-control input-sm" id="add_row" type="number"> 
 
    
 
<div class="box"></div>

來源

2017-09-13 11:39:49

如果我不想空框字段，因爲如果我們有4個元素，它應該增加或減少元素長度不完全清空所有的值。 –

您可能需要對現有元素進行計數並相應地增加/減少 –

好的，如果您不介意可以請更新您的答案嗎？ –

一個非常基本實現了基於數量的字段。然而，你可能希望引入輸入清理包括最大限制：您需要驗證的負輸入（不：

$("#add_row").change(function(){ 

    var total = $(this).val(); 
    for (i = 0; i < total; i++) { 
     $(".box").append('test <br />'); 
    } 

});

來源

2017-09-13 11:33:01 kinggs

根據數值字段中的值添加或刪除元素

回答

相關問題