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

如何动态添加表单字段

所以我的表格看起来像：

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

Snippet

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