HTML select 标签的简单用法
HTML：
<!DOCTYPE html>
<html>
<body>
<div>
<div>
<label>请选择：</label>
</div>
<div>
<select id="add_number">
<option id="on">是</option>
<option id="off">否</option>
</select>
</div>
</div>
</body>
<script type="text/javascript">
</script>
</html>
显示：
 |
切换事件：
document.getElementById("add_number").onchange = function(){
alert(this.value)
}
遍历选项：
var options = document.getElementById("add_number").options
for (i=0; i<options.length; i++){
alert(options[i].innerHTML)
}
判断被选中选项：
var options = document.getElementById("add_number").options
for (i=0; i<options.length; i++){
if(options[i].selected == true){
alert("被选中选项：" + options[i].innerHTML)
}
}
完整例子：
<!DOCTYPE html>
<html>
<body>
<div>
<div>
<label>请选择：</label>
</div>
<div>
<select id="add_number">
<option id="on">是</option>
<option id="off">否</option>
</select>
</div>
</div>
<button id="btn1">打印所以选项</button>
<button id="btn2">判断当前选项</button>
</body>
<script type="text/javascript">
document.getElementById("add_number").onchange = function(){
alert("add_number 发生切换")
}
document.getElementById("btn1").onclick = function(){
var options = document.getElementById("add_number").options
for (i=0; i<options.length; i++){
alert(options[i].innerHTML)
}
}
document.getElementById("btn2").onclick = function(){
var options = document.getElementById("add_number").options
for (i=0; i<options.length; i++){
if(options[i].selected == true){
alert("被选中选项：" + options[i].innerHTML)
}
}
}
</script>
</html>
