今天没事干复习一下之前做的东西，突然想到做个三级联动的列表，我个人觉得做这个主要练习数组的运用,
做这个时只要脑子里有顺序就不会太麻烦，在点击上一个的时候自己要知道即将执行哪个函数，数组将会怎样进行查找，通过捋顺自己的思路，你就会觉得好简单，只不过是循环罢。
以下是举的一个小例子的源代码（随便写的）
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>城市查询</title>
</head>
<body>
<select name="province" id="province">
<option value="省份" selected="selected">省份</option>
</select>
<select name="city" id="city">
<option value="城市" id="sx" selected="selected">所在市/区</option>
</select>
<select name="xian" id="xian">
<option value="县城" id="xc" selected="selected">所在县/区 </option>
</select>
<script type="text/javascript">
// 省 市 县
var province = document.getElementById('province');
var city = document.getElementById('city');
var xiancheng = document.getElementById('xian');
//城市
var cityArr = [];
cityArr[0] = ['北京市',['东城区','建国门街道','朝阳门街道']];
cityArr[1] = ['天津市',['南开区','八里台街','长虹街','鼓楼街','广开街','华苑','街嘉陵道','街体育中心街','兴南街']];
cityArr[2] = ['上海市',['浦东新区','陆家嘴街道','周家渡街道','塘桥街道']];
cityArr[3] = ['重庆市',['万盛区','南桐','青年','石林']];
cityArr[4] = ['河北省',['石家庄市','新华区','长安区'],['唐山市','滦县','迁西县']];
cityArr[5] = ['河南省',['郑州市','中原区','金水区'],['开封市','兰考县','龙亭区'],['洛阳市','汝阳县','孟津县'],['周口市','川汇区','扶沟县','西华县','商水县'],['驻马店市','驻马店驿城区','西平县','上蔡县','正阳县']];
cityArr[6] = ['云南省',['昆明市','盘龙区','五华区','西山区','东川区']];
//省份
for(var i=0 ;i< cityArr.length;i++) {
var provinceOption = document.createElement('option');
provinceOption.text = cityArr[i][0];
province.options.add(provinceOption);
}
var sx=document.getElementById("sx");
// 获取相应县市
function getcity(pro,city,cityArr){
sx.style.display="none";
var P_value=pro.value;
var length=cityArr.length;
city.length = 1;
for(var i=0;i<length;i++){
if(P_value==cityArr[i][0]){
for(var j=1;j<cityArr[i].length;j++){
var pre=document.createElement('option');
pre.text=cityArr[i][j][0];
city.options.add(pre);
}
}
}
}
//县城的加载
function getcounty(city,county,cityArr){
var P_value=city.value;
var length=cityArr.length;
county.length = 1;
for(var i=0;i<length;i++){
for(var a=1;a<cityArr[i].length;a++) {
if (P_value == cityArr[i][a][0]) {
for (var j = 1; j < cityArr[i][a].length; j++) {
var pre = document.createElement('option');
pre.text = cityArr[i][a][j];
county.options.add(pre);
}
}
}
}
}
// 当鼠标点击省份时执行的方法
province.onchange = function() {
getcity(province,city,cityArr);
}
// 当鼠标点击城市时执行的方法
city.onchange = function() {
getcounty(city,xiancheng,cityArr);
}
</script>
</body>
</html>
做这个时只要脑子里有顺序就不会太麻烦，在点击上一个的时候自己要知道即将执行哪个函数，数组将会怎样进行查找，通过捋顺自己的思路，你就会觉得好简单，只不过是循环罢
写的有点麻烦，不过你可以再简化一点，在循环中可以适当的进行修改以增加代码的运行效率