如何生成html元素遞歸基於用戶輸入與js？

我正在編寫以下javascript應用程序以從用戶獲取數據。當用戶從選擇菜單中選擇值時，它會根據選項值顯示不同的表單元素。我有以下代碼如何生成html元素遞歸基於用戶輸入與js？

HTML

<select> 
    <option value="">hi</option> 
    <option value="1">1</option> 
</select> 
<div></div>

的Javascript

var myFunc = function() { 
    var string = '<input><span>+</span>'; 
    $(string).appendTo('div'); 
    $('span').on('click', function() { 
     myFunc(); 
    }) 
}; 


$('select').on('change', function() { 
    var value = $(this).val(); 
    if (value == 1) { 
     myFunc(); 
    } 
})

我的問題是，當加號圖標，用戶點擊它應該顯示與加號另一 input元素。當用戶選擇最後一個加號時，應該發生同樣的事情。
但前面的加號應該變成負號。並且當用戶點擊減號時，應刪除所有下面的元素到減號標記。

當前我的代碼生成輸入元素。但我不明白添加減號和刪除其他元素的方式。還需要限制輸入元素的數量爲5.請幫助我。 :)

DEMO

來源

2014-03-19 sam No1

試試這個答案http://stackoverflow.com/questions/22322218/add-input-field-with- jquery/22322641＃22322641 –

@RakeshKumar哇，非常感謝你。這正是我正在尋找的... –

你可以試試這個：

var myFunc = function() { 
    var string = '<input /><span>+</span>'; 
    $('div span').html('-'); 
    $(string).appendTo('div'); 
    $('span').click(function() { 
     if ($(this).text() == '-') 
     { 
      $(this).nextAll().remove(); 
      $(this).html('+'); 
     } 
     else 
      myFunc(); 
    }); 
}; 


$('select').on('change', function() { 
    var value = $(this).val(); 
    if (value == 1) { 
     myFunc(); 
    } 
})

Fiddle

來源

2014-03-19 05:42:45 H77

謝謝你這個代碼解決了另一個問題 –

如何生成html元素遞歸基於用戶輸入與js？

回答

相關問題