下拉列表框的HTML标记:
<select id = "sel"></selcet>
这样一个下拉列表框要通过JavaScript控制其中数据项的添加。
实现添加的JS代码：
(1)var selObj = document.getElementById("sel");
通过这种方式获取页面上的select下拉列表对象。
(2)var Option = document.createElement("OPTION");
创建option对象。
(3)Option.value = "";
Option.text = "";
这里对新增加的Option对象进行赋值。
至此构造的Option应该是这新的效果：<option value="">***</option>
(4)selObj.options.add(Option);
添加Option对象到下拉列表框中。
这样就能向下拉列表框中添加一项内容了。
一个例子
(1) HTML文件代码如下：
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>MyHtml.html</title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<script type="text/javascript">
function add() {
var selObj = document.getElementById("sel");
var valObj = document.getElementById("val");
var texObj = document.getElementById("tex");
// 关键是这几句
var Option = document.createElement("OPTION");
Option.value = valObj.value;
Option.text = texObj.value;
selObj.options.add(Option);
}
</script>
</head>
<body>
<select id="sel"></select>
<br>
value: <input type="text" id="val">
<br>
text :<input type="text" id="tex">
<br><br>
<input type="button" value="add" onclick="add()">
</body>
</html>
(2) 程序运行截图：
1) 程序初始运行界面：
2) 输入要添加的下拉列表框中数据项：
3) 添加下拉列表框的选项：
本站仅提供存储服务，所有内容均由用户发布，如发现有害或侵权内容，请
点击举报。
