Question

我有一个带有选择框的简单表单我想填充数据，但我不明白该怎么做。

这是我的表格：

<form name="form">    
 <select name="req_one" style="width:250px;"/> </select>    
</form>

这是我在JS中尝试过的：

var name = 'test';
var i = 1;
document.form.req_one =new Option(name, i);

这应该产生等价物：

<option value="1"> Test </option>

我做错了什么？

Answer 1

您需要等到DOM中的选择

以下是DEMO

的示例

<html>
<head>
<script>
window.onload=function() {
  var name = 'test';
  var i = 1;
  var sel = document.myform.req_one; // or document.getElementsByName["req_one"[0];
  if (sel) {
    sel.options[sel.options.length] =new Option(name, i);
  }
  else {
    alert("Where did the sel go?");
  }
}
</script>
</head>
<body>
<form name="myform">    
  <select name="req_one" style="width:250px;"/> </select>    
</form>
</body>
</html>

Answer 2

我建议使用jquery一个简单的方法。

var name = 'test';
var i = 1;
$("select[name='req_one']").append('<option value="'+i+'">'+value+'</option>');

我希望你知道如何使用jquery。

Answer 3

你犯了一个小错误。我整合了你的整个代码：

<html>
<head>
<script type="text/javascript">
function l1(){
    var name = 'test';
    var i = 1;
    document.form.req_one.options[0] =new Option(name, i);//you forgot to include .options[0]
}
</script>
</head>
<body onload="l1()">
<form name="form">    
 <select name="req_one" style="width:250px;"/> </select>    
</form>
</body>
</html>

Answer 4

您忘记将新创建的Option添加到select元素的选项列表中：

document.form.req_one.options[0] = new Option(name, i);

JSFiddle示例：http://jsfiddle.net/zxT8U/2/

如何使用Javascript填充选择框

4 个答案: