使用 javascript 创建多选表单

Create multiple select form with javascript

本文关键字：表单 创建 javascript 使用      更新时间：2023-09-26

我有问题。

我可以使用 JavaScript 创建多选表单吗？

这里是例子

<select name="item[]">
<option value="0">Option 1</option>
<option value="1">Option 2</option>
</select>
<select name="item[]">
<option value="0">Option 1</option>
<option value="1">Option 2</option>
</select>
<select name="item[]">
<option value="0">Option 1</option>
<option value="1">Option 2</option>
</select>

以及更多...

我想用这个来做这件事：

<script>
var loop = 3;
for(i=0; i<=3 i++){
// some code to generate them
}
</script>

有人可以帮助我吗？谢谢

试试这个（使用 javascript）：

for(var i=0;i<10;i++){
   var sel = newElement("select",{name:"sel1"});
   //Add the options
   sel.options[sel.options.length] = new Option("text0","value0");
   sel.options[sel.options.length] = new Option("text1","value1");
   sel.options[sel.options.length] = new Option("text2","value2");
   sel.options[sel.options.length] = new Option("text3","value3");
   //add the element to the form
   document.getElementById("formId").appendChild(sel);
}

这将在您的表单中创建 10 个选择框，这样，您可以在表单中附加任何选择框的编号。

使用 .clone 创建匹配元素的副本

试试这个：

for (var i = 0; i < 5; i++) {
  var clonned = $('select[name="item[]"]:first').clone();
  $('body').append(clonned);
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<select name="item[]">
  <option value="0">Option 1</option>
  <option value="1">Option 2</option>
</select>

在这里摆弄

相关文章：