原文来源:http://www.cnblogs.com/dtdxrk/archive/2012/09/05/2671429.html
1.清空select的项
2.如果留下第一行的话就是
3.添加option
4.删除一个option
5.修改option内容
6.设置一个option为默认选择状态
7.当前select选中项的value
8.当前select选中项的Index
一个练习
1.清空select的项
objSelect.options.length = 0;
2.如果留下第一行的话就是
objSelect.options.length = 1;
3.添加option
objSelect.options.add(new Option(text, value))
4.删除一个option
objSelect.options.remove(i);
5.修改option内容
objSelect.options[i].value = value
objSelect.options[i].text = text
6.设置一个option为默认选择状态
objSelect.options[i].selected = true;
7.当前select选中项的value
objSelect.value
8.当前select选中项的Index
objSelect.selectedIndex
一个练习
<!DOCTYPE HTML>
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text.html; charset=utf-8"/>
<title>js省份级联</title>
</head>
<body>
<select id="pro">
<option>请选择省份</option>
</select>
<select id="city">
<option>请选择城市</option>
</select>
<script type="text/javascript">
(function(){
var str = [{
"id" : 0,
"pro" : '江苏',
"city" : [{name : '南京'},{name : '苏州'},
{name : '常州'},{name : '无锡'},
{name : '镇江'},{name : '宁波'}]
},{
"id" : 1,
"pro" : '上海',
"city" : [{name : '徐汇区'},{name : '闵行区'},
{name : '嘉定区'},{name : '浦东区'},
{name : '浦西区'}]
},{
"id" : 2,
"pro" : '北京',
"city" : [{name : '朝阳区'},{name : '海淀区'},
{name : '东城区'},{name : '西城区'},
{name : '崇文区'},{name : '宣武区'},
{name : '丰台区'},{name : '石景山区'},
{name : '通州区'}]
}];
var proSelect = document.getElementById("pro");
var citySelect = document.getElementById("city");
//添加省份
for(var i=0; i<str.length; i++){
proSelect.options.add(new Option(str[i]["pro"],str[i]["id"]));
}
//点击省份读取城市列表
proSelect.onchange = function(){
citySelect.options.length = 1;
var citys = str[proSelect.value]["city"];
for(var i=0; i<citys.length; i++){
citySelect.options.add(new Option(citys[i]["name"]));
}
}
}())
</script>
</body>
</html>