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

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

所以我的表格看起来像：

<form action="/reservation-add" method="post">
<select id="dropdownlist">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
</select>
<input></input>
</form>

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

解决方法:

使用这种方式：

$("#dropdownlist").change(function () {
    var numInputs = $(this).val();
    for (var i = 0; i < numInputs; i++)
        $("#inputArea").append('<input name="inputs[]" />');
});

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

<div id="inputArea"></div>

片段

$("#dropdownlist").change(function () {
  var numInputs = $(this).val();
  for (var i = 0; i < numInputs; i++)
    $("#inputArea").append('<input name="inputs[]" />');
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<select id="dropdownlist">
  <option>Select...</option>
  <option value="1">1</option>
  <option value="2">2</option>
  <option value="3">3</option>
  <option value="4">4</option>
  <option value="5">5</option>
</select>
<div id="inputArea"></div>