JavaScript数组应用,关联下拉菜单实现
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script type="text/javascript">
//map形式 键值对
var cityList = [];
cityList["湖南省"] = ["长沙市","株洲市","湘潭市"];
cityList["湖北省"] = ["武汉市","黄冈市","十堰市"];
cityList["广东省"] = ["广州市","深圳市","东莞市"];
function loadCity(){
var prov=document.getElementById("selProv").value;
//清空之前的选项
document.getElementById("selCity").options.length=1;
for(var i in cityList[prov]){
//创建option,值为cityList[ind-1][i]
var op=new Option(cityList[prov][i]);
//把new出来的option塞进城市select
document.getElementById("selCity").options.add(op);
}
}
</script>
</head>
<body>
<div>
<p>省份:<select id="selProv" onchange="loadCity()">
<option>====请选择====</option>
<option>湖南省</option>
<option>湖北省</option>
<option>广东省</option>
</select></p>
<p>城市:<select id="selCity">
<option>====请选择====</option>
</select></p>
</div>
</body>
</html>
效果是第一个下拉框点击湖南省,另一个下拉框动态的变成长株潭、同样的点击别的第二个就会动态变成那个省的城市
这里使用数组使用的是键值对的形式(map形式),也可以定义二维数组,就像是ArrayList集合一样

不错哦,还挺详细的