完整国内城市js级联选择

js代码:

 var china = [//直辖市['北京市'],['上海市'],['天津市'],['重庆市'],//华北地区['河北省','石家庄','唐山','秦皇岛','邯郸','邢台','保定','张家口','承德','沧州','廊坊','衡水'],['山西省','太原','大同','阳泉','长治','晋城','朔州','晋中','运城','忻州','临汾','吕梁'],['内蒙古自治区','呼和浩特','包头','乌海','赤峰','通辽','鄂尔多斯','呼伦贝尔','巴彦淖尔','乌兰察布','兴安','锡林郭勒','阿拉善'],//东北地区['辽宁省','沈阳','大连','鞍山','抚顺','本溪','丹东','锦州','营口','阜新','辽阳','盘锦','铁岭','朝阳','葫芦岛'],['吉林省','长春','吉林','四平','辽源','通化','白山','松原','白城','延边'],['黑龙江','哈尔滨','齐齐哈尔','鸡西','鹤岗','双鸭山','大庆','伊春','佳木斯','七台河','牡丹江','黑河','绥化','大兴安岭'],//华东地区['江苏省','南京','无锡','徐州','常州','苏州','南通','连云港','淮安','盐城','扬州','镇江','泰州','宿迁'],['浙江省','杭州','宁波','温州','嘉兴','湖州','绍兴','金华','衢州','舟山','台州','丽水'],['安徽省','合肥','芜湖','蚌埠','淮南','马鞍山','淮北','铜陵','安庆','黄山','滁州','阜阳','宿州','巢湖','六安','亳州','池州','宣城'],['福建省','福州','厦门','莆田','三明','泉州','漳州','南平','龙岩','宁德'],['江西省','南昌','景德镇','萍乡','九江','新余','鹰潭','赣州','吉安','宜春','抚州','上饶'],['山东省','济南','青岛','淄博','枣庄','东营','烟台','潍坊','威海','济宁','泰安','日照','莱芜','临沂','德州','聊城','滨州','菏泽'],//中南地区['河南省','郑州','开封','洛阳','平顶山','焦作','鹤壁','新乡','安阳','濮阳','许昌','漯河','三门峡','南阳','商丘','信阳','周口','驻马店'],['湖北省','武汉','黄石','襄樊','十堰','荆州','宜昌','荆门','鄂州','孝感','咸宁','随州','恩施'],['湖南省','长沙','株洲','湘潭','衡阳','邵阳','岳阳','常德','张家界','益阳','郴州','永州','怀化','娄底','湘西'],['广东省','广州','深圳','珠海','汕头','韶关','佛山','江门','湛江','茂名','肇庆','惠州','梅州','汕尾','河源','阳江','清远','东莞','中山','潮州','揭阳','云浮'],['广西自治区','南宁','柳州','桂林','梧州','北海','防城港','钦州','贵港','玉林','百色','贺州','河池','来宾','崇左'],['海南省','海口','三亚'],//西南地区['四川省','成都','自贡','攀枝花','泸州','德阳','绵阳','广元','遂宁','内江','乐山','南充','宜宾','广安','达州','眉山','雅安','巴中','资阳',"阿坝","甘孜","凉山"],['贵州省','贵阳',"六盘水","遵义","安顺","铜仁","毕节","黔西南","黔东南","黔南"],['云南省','昆明','曲靖','玉溪',"保山","昭通","丽江","普洱","临沧","文山","红河","西双版纳","楚雄","大理","德宏","怒江","迪庆"],['西藏自治区',"拉萨","昌都","山南","日喀则","那曲","阿里","林芝"],//西北地区['陕西省','西安','铜川','宝鸡','咸阳','渭南','延安','汉中','榆林','安康','商洛'],['甘肃省',"兰州","嘉峪关","金昌","白银","天水","武威","张掖","平凉","酒泉","庆阳","定西","陇南","临夏","甘南"],['青海省',"西宁","海东","海北","黄南","海南","果洛","玉树","海西"],['宁夏自治区','银川',"石嘴山","吴忠","固原","中卫"],['新疆自治区','乌鲁木齐',"克拉玛依","吐鲁番","哈密","和田","阿克苏","喀什","克孜勒苏柯尔克孜","巴音郭楞蒙古","昌吉","博尔塔拉蒙古","伊犁哈萨克","塔城","阿勒泰"],//港澳台['香港特别行政区'],['澳门特别行政区'],['台湾省',"台北","高雄","基隆","台中","台南","新竹","嘉义"]];function BindProvince(){var opt0 = "省份";var ProvinceCount=china.length;var ddlProvince = document.getElementById("ddlProvince");ddlProvince.innerHTML = "";ddlProvince.options[0] = new Option(opt0,"");for(var i=0; i<ProvinceCount; i++){ddlProvince.options[i+1] = new Option(china[i][0],china[i][0]);}}function BindCity(City){var opt0 = "省份";var ProvinceCount=china.length;var ddlProvince = document.getElementById("ddlProvince");ddlProvince.innerHTML = "";ddlProvince.options[0] = new Option(opt0,"");var opt0City = "城市";var ddlCity = document.getElementById("ddlCity");ddlCity.innerHTML = "";ddlCity.options[0] = new Option(opt0City,"");var flag=false;var chose=true;var selectProvinceIndex=0;for(var i=0; i<ProvinceCount; i++){if(!flag){var cityCount = china[i].length;for(var j=1; j<cityCount; j++){if(china[i][j]==City){flag=true;selectProvinceIndex=i;break;}}}ddlProvince.options[i+1] = new Option(china[i][0],china[i][0]);if(flag && chose){ddlProvince.options[i+1].selected = true;chose=false;}}var cityCount = china[selectProvinceIndex].length;for(var i=0; i<cityCount; i++){if(cityCount == 1 && i == 0){ddlCity.options[i+1] = new Option(china[selectProvinceIndex][i],china[selectProvinceIndex][i]);i = 1;}else if(cityCount > 1 && i == 0){i = 1;ddlCity.options[i] = new Option(china[selectProvinceIndex][i],china[selectProvinceIndex][i]);}else{ddlCity.options[i] = new Option(china[selectProvinceIndex][i],china[selectProvinceIndex][i]);}if(china[selectProvinceIndex][i]==City){ddlCity.options[i].selected=true;}}}function selectMoreCity(sbj){var opt0 = "城市";if(sbj.selectedIndex==0){var ddlCity = document.getElementById("ddlCity");ddlCity.innerHTML = "";ddlCity.options[0] = new Option(opt0,"");return;}var selectProvince = sbj.options[sbj.selectedIndex].value;var ProvinceCount = china.length;for(var i=0; i<ProvinceCount; i++){if(china[i][0] == selectProvince){var cityCount = china[i].length;var ddlCity = document.getElementById("ddlCity");ddlCity.innerHTML = "";ddlCity.options[0] = new Option(opt0,"");for(var j=0; j<cityCount; j++){if(cityCount == 1 && j == 0){ddlCity.options[j+1] = new Option(china[i][j],china[i][j]);j = 1;}else if(cityCount > 1 && j == 0){j = 1;ddlCity.options[j] = new Option(china[i][j],china[i][j]);}else{ddlCity.options[j] = new Option(china[i][j],china[i][j]);}if(j == 1){ddlCity.options[1].selected = true;}}break;}}}

html代码:

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>省份城市选择 </title>
</head>
<body>
<script type="text/javascript" src="morecity.js" mce_src="morecity.js"></script>
<FORM class="city_title" onsubmit="manSub(this);return false;" name="spc">
按省份选择： 
<select  name="ddlProvince" id="ddlProvince" onchange="selectMoreCity(this)"></select><select name="ddlCity" id="ddlCity"><option selected value="">城市</option></select><INPUT value="确定" type="submit" name="提交">
</FORM>
<script type="text/javascript" language ="javascript"><!--//BindProvince();//只初始化省份
         BindCity("洛阳");//初始化，并选中洛阳市和洛阳市所在的省
// --></script></body>
</html>