<select id="province" οnchange="getCity()">
<option value="0">所在省</option>
<option value="直辖市">直辖市</option>
<option value="广东省">广东省</option>
<option value="江苏省">江苏省</option>
<option value="福建省">福建省</option>
</select>
<select id="city" οnchange="getDistrict()">
<option value="0">所在市</option>
</select>
<select id="district">
<option value="0">所在区</option>
</select>
根据数据下标简单的绑定判断
<script>
var city=[
["所在市","北京市","天津市","上海市","重庆市"],
["所在市","广州市","深圳市","珠海市","东莞市"],
["所在市","南京市","苏州市","南通市","常州市"],
["所在市","福州市","厦门市","莆田市","泉州市"]
];
var district=[
[
["东城区","西城区","宣武区"],["和平区","红桥区","塘沽区"],["杨浦区","徐汇区"],["万州区","涪陵区"]
],
[
["天河区","海珠区","白云区","番禺区"],["南山区","宝安区","福田区"],["香洲区","斗门区","金湾区"],["东城区","莞城区","万江区"]
],
[
['玄武区','白下区','秦淮区','建邺区'],['沧浪区','平江区','金阊区','虎丘区'],['崇川区','港闸区','海安县','如东县'],['天宁区','钟楼区','新北区']
],
[
['鼓楼区','台江区','仓山区','马尾区'],['思明区','海沧区','湖里区','集美区'],['城厢区','涵江区','荔城区','秀屿区'],['鲤城区','丰泽区','洛江区','泉港区']
]
];
//根据选择省份添加市
var pro=-1;//定义变量记录选择的省份下标
function getCity(){
var pr=document.getElementById("province");
var citys=document.getElementById("city");
var qu=document.getElementById("district");
citys.length=0;//每次触发清空上一次的内容
pro=pr.selectedIndex-1;
for(var a=0;a<city.length;a++){
if(pro==a){//根据下标判断
for(var b in city[a]){
citys.add(new Option(city[a][b],city[a][b],true,false));
}
}
if(pr.selectedIndex==0){//省份切换到所在省选项,市和区清空
citys.length=0;
qu.length=0;
citys.add(new Option("所在市" ,"所在市",true,false))
qu.add(new Option("所在区" ,"所在区",true,false));
}
}
}
//根据市区添加区县
function getDistrict(){
var citys=document.getElementById("city");
var qu=document.getElementById("district");
qu.length=0;
var slequ= citys.selectedIndex-1;//选择的市下标
for (var x=0;x<district[pro].length;x++){
if(slequ==x){
console.log(district[pro][x])
for (var y in district[pro][x]) {
qu.add(new Option(district[pro][x][y],district[pro][x][y],true,false));
}
}
if(citys.selectedIndex==0){
qu.length=0;
qu.add(new Option("所在区" ,"所在区",true,false));
}
}
}
</script>