选择下拉选项时，在表单中添加输入字段

如何动态添加表单中的字段

所以我的表格看起来像：

  1 2 3 4 5    

如果选择例如3它应该附加3个新输入（可以是数组以获取所有值）我知道我必须使用javascript但我不知道如何。

Answer 1

使用这种方式：

 $("#dropdownlist").change(function () { var numInputs = $(this).val(); for (var i = 0; i < numInputs; i++) $("#inputArea").append(''); }); 

有另一个div ，ID为“inputArea”：

片段

 $("#dropdownlist").change(function () { var numInputs = $(this).val(); for (var i = 0; i < numInputs; i++) $("#inputArea").append(''); }); 

   Select... 1 2 3 4 5  
 

Answer 2

 
  1 2 3 4 5    

Jquery代码

  $(document).ready(function () { $('#dropdownlist').on('change',function () { var howmuch = $(this).val(); var appendhtml = ''; for (i = 0; i < howmuch; i++) { appendhtml+= ""; } $('.appendform').append(appendhtml); }); }); 

Answer 3

 $("#dropdownlist").on("change",function(e){ for(i=0; i < $(this).val() ;i++){ $("form").append($("")); } }) 

Answer 4

试试这个

  
  1 2 3 4 5    

Answer 5

第1步 —将id添加到表单中
第2步 —使用jquery onchange方法，代码如下所示

 
   2 3 4 5  
 $('#dropdownlist').on("change",function() { for(var i=0;i<this.value;i++) { $("#myForm").append(" 
"); } }); 

Answer 6

解决在初始下拉选择之后添加更多输入字段的问题（如果用户在初始选择后改变主意），这是该页面上所有答案的情况。 请参阅以下解决方案：

 $("#dropdownlist").change(function () { $("#inputArea > :input").remove(); var numInputs = $(this).val(); for (var i = 0; i < numInputs; i++) $("#inputArea").append(''); });