Question

我有一个用户输入的值。如何在javascript / jQuery或PHP中为用户创建一定数量的表单项？

EG。

<select id = "Fooinput" name = "Foo">
    <option value = "0">0</option>
    <option value = "1">1</option>
    <option value = "2">2</option>
    <option value = "3">3</option>
    <option value = "4">4</option>
</select>
<button id ="fooclick">Button</button>
<div id="fillout"></div>

在jQuery中有类似的东西

$(document).ready(function(){
  var inputnum = $("Fooinput").val();
  $("#foobutton").click(function(){
      for (var i=0; i<inputnum;i++){
          $("#fillout").append('<select id="uniqueid">OPTIONS</select>');
      } 
  });
});

我很高兴看到jQuery或PHP的解决方案，我只是不明白如何通过给所有选择框一个唯一的ID来检索值。

Answer 1

在循环中提供唯一ID inputnum

$("#fillout").append('<select id="uniqueid'+inputnum+'" class="Dropdown">OPTIONS</select>');

因此，ID将是唯一的，例如uniqueid0，uniqueid1等。

然后您可以使用唯一ID，使用

之类的事件来访问它

$(".Dropdown").click(function(){
    $(this).attr(id);
});

使用Inspect元素Fiddle进行检查，获得唯一ID，在这种情况下我硬编码1但是相同的值将在您的代码中循环。

Answer 2

这段代码可以解决问题

注意：我在点击事件中移动了var inputnum = $("Fooinput").val();，因为作为OP，您将在页面加载时获得值而非点击。

 $(document).ready(function(){

  $("#foobutton").click(function(){
      var inputnum = $("Fooinput").val();
      for (var i=0; i<inputnum;i++){
          $("#fillout").append('<select id="uniqueid-'+$i+'">OPTIONS</select>');
      } 
  });
});

根据用户输入创建多个表单项

2 个答案: