根据其他元素的选择修改一个选项列表
上一篇 /
下一篇 2012-05-22 21:45:50
/ 个人分类：javascript
选择省份之后，然后再选择该省的城市。
下面是样例。主要是为onchange事件分配个函数，传入值是省份，然后根据省份将地市选出。省份和地市的关系则保存在二维数组中。
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Populating Selection Lists</title>
<script>
//<![CDATA[
var citystore = new Array();
citystore[0] = ['广东','广州'];
citystore[1] = ['广东','深圳'];
citystore[2] = ['广东','汕头'];
citystore[3] = ['湖南','长沙'];
citystore[4] = ['湖南','岳阳'];
citystore[5] = ['广西','桂林'];
citystore[6] = ['广西','阳朔'];
citystore[7] = ['广西','南宁'];
window.onload = function() {
document.getElementById("state").onchange = filterCities;
}
function filterCities(){
var state = this.value;
var city = document.getElementById('cities');
city.options.length=0;
for (var i = 0; i < citystore.length; i++){
var st = citystore[i][0];
if( st == state){
var pt = new Option(citystore[i][1]);
try{
city.add(opt,null);
}catch(e){
city.add(opt);
}
}
}
}
//--><!]]
</script>
</head>
<body>
<form. id="picker" method="post" action="">
<select id='state'>
<option value="">--</option>
<option value="广东">广东</option>
<option value="湖南">湖南</option>
<option value="广西">广西</option>
</select>
<select id="cities">
</select>
</form>
</body>
</html>
收藏
举报
TAG:
