标签：
| <html> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="Generator" content="EditPlus®"> | |
| <meta name="Author" content=""> | |
| <meta name="Keywords" content=""> | |
| <meta name="Description" content=""> | |
| <title>级联效果</title> | |
| <script> | |
| var cityList = new Array(); | |
| cityList[‘北京市‘] = [‘朝阳区‘,‘东城区‘,‘西城区‘, ‘海淀区‘,‘宣武区‘,‘丰台区‘,‘怀柔‘,‘延庆‘,‘房山‘]; | |
| cityList[‘上海市‘] = [‘宝山区‘,‘长宁区‘,‘丰贤区‘, ‘虹口区‘,‘黄浦区‘,‘青浦区‘,‘南汇区‘,‘徐汇区‘,‘卢湾区‘]; | |
| cityList[‘广州省‘] = [‘广州市‘,‘惠州市‘,‘汕头市‘,‘珠海市‘,‘佛山市‘,‘中山市‘,‘东莞市‘]; | |
| cityList[‘深圳市‘] = [‘福田区‘, ‘罗湖区‘, ‘盐田区‘, ‘宝安区‘, ‘龙岗区‘, ‘南山区‘, ‘深圳周边‘]; | |
| cityList[‘重庆市‘] = [‘俞中区‘, ‘南岸区‘, ‘江北区‘, ‘沙坪坝区‘, ‘九龙坡区‘, ‘渝北区‘, ‘大渡口区‘, ‘北碚区‘]; | |
| cityList[‘天津市‘] = [‘和平区‘, ‘河西区‘, ‘南开区‘, ‘河北区‘, ‘河东区‘, ‘红桥区‘, ‘塘古区‘, ‘开发区‘]; | |
| cityList[‘江苏省‘] = [‘南京市‘,‘苏州市‘,‘无锡市‘]; | |
| cityList[‘浙江省‘] = [‘杭州市‘,‘宁波市‘,‘温州市‘]; | |
| cityList[‘四川省‘] = [‘四川省‘,‘成都市‘]; | |
| cityList[‘海南省‘] = [‘海口市‘]; | |
| cityList[‘福建省‘] = [‘福州市‘,‘厦门市‘,‘泉州市‘,‘漳州市‘]; | |
| cityList[‘山东省‘] = [‘济南市‘,‘青岛市‘,‘烟台市‘]; | |
| cityList[‘江西省‘] = [‘江西省‘,‘南昌市‘]; | |
| cityList[‘广西省‘] = [‘柳州市‘,‘南宁市‘]; | |
| cityList[‘安徽省‘] = [‘安徽省‘,‘合肥市‘]; | |
| cityList[‘河北省‘] = [‘邯郸市‘,‘石家庄市‘]; | |
| cityList[‘河南省‘] = [‘郑州市‘,‘洛阳市‘]; | |
| cityList[‘湖北省‘] = [‘武汉市‘,‘宜昌市‘]; | |
| cityList[‘湖南省‘] = [‘湖南省‘,‘长沙市‘]; | |
| cityList[‘陕西省‘] = [‘陕西省‘,‘西安市‘]; | |
| cityList[‘山西省‘] = [‘山西省‘,‘太原市‘]; | |
| cityList[‘黑龙江省‘] = [‘黑龙江省‘,‘哈尔滨市‘]; | |
| cityList[‘其他‘] = [‘其他‘]; | |
| function changeCity(){ | |
| //1.得列省份下拉列表的选中值 | |
| var provinceVal = document.getElementById("province").value; | |
| //2.从表找到它所对应城市列表 | |
| var citysss = cityList[provinceVal]; | |
| //3.清除城市列表中原有的值 | |
| document.getElementById("city").options.length=1; | |
| //4.遍历城市数组,同时向城市下拉列表中添加option | |
| for(var i=0;i<citysss.length;i++){ | |
| document.getElementById("city").add(new Option(citysss[i],citysss[i])); | |
| } | |
| } | |
| function initProvince(){ | |
| //1.获取省份列表 | |
| var provinceObj = document.getElementById("province"); | |
| //1.for..in循环的作用：用于遍历对象的所有属性 | |
| for(var i in cityList){ | |
| provinceObj.add(new Option(i,i)); | |
| } | |
| } | |
| window.onload = initProvince; | |
| </script> | |
| </head> | |
| <body> | |
| <select id="province" onchange="changeCity()"> | |
| <option>--请选择省份--</option> | |
| </select> | |
| <select id="city"> | |
| <option>--请选择城市--</option> | |
| </select> | |
| </body> | |
| </html> | |
标签：
原文地址：http://www.cnblogs.com/FG123/p/4445377.html
