基于在下拉菜单中选择号码输入字段jQuery的动态创建？(jQuery dynamic creati

我试图完成沿此线的东西：

http://devblog.jasonhuck.com/assets/infiniteformrows.html

但是......我想显示一个下拉选择字段，其值1到20，并根据其价值得到在这一领域这是多少输入字段，我会向用户显示填写页面上选择（不清爽，当然）。

所以，如果我在下拉框中选择4（最初有显示任何输入字段，作为默认应为0），正下方写着4线名称和电子邮件输入字段应建立，所有的唯一标识符等（用于存储到MySQL）。

而对于我的生命，我找不到任何人正是这样做的任何的例子，所以我想我在这里提出一个小的挑战，而不是。

提前致谢！

Answer 1:

所有你需要做的，是找出哪些号码时，用户通过这个数字改变了下拉列表，然后循环选择，从而为每一次迭代两个输入字段。

$("#selectBox").change(function() {
  var htmlString = "";
  var len = $("options:selected", this).val();
  for (var i = 0; i < len; i++) {
    htmlString += "<input type='text' class='email'>";
    htmlString += "<input type='text' class='name'>";
  }
  $("#outputArea").html(htmlString);
}

你甚至可能要使它更聪明，所以它会检查多少输入字段，你已经有了，然后让只有尽可能多的需要，或去掉一些。 这样的话，这将是一个快一点（：

Answer 2:

这会后在页面上选择插入一个文本框。 它将每个号被改变时触发。

var idFun = 0;
$('select').change(function() { 
  var end=$(this).val(); 
  for (var i=0;i<end;i++) {
    $('<div><input id="fun' + (idFun++) + ' type="text" ></div>').appendTo($('#myinputs'));

  }
});

HTML：

<select>
  ... 1 to 20 here
</select>
<div id="myinputs"></div>

希望这可以帮助。

Answer 3:

真正的sollution：

<script type="text/javascript">

    $(document).ready(function() {

        $("#AantalAntw").change(function() {
            var htmlString = "";
            var len = $("#AantalAntw").val();
            for (var i = 0; i < len; i++) {
                htmlString += "<input type='text' class='email'>";
                htmlString += "<input type='text' class='name'>";
            }
            alert(htmlString);
            $("#antwblok").html(htmlString);
        });
    });

</script>

文章来源: jQuery dynamic creation of input fields based on the number selected in a dropdown menu?