教程集 > 脚本编程 > javascript > 正文城市二级联动菜单

城市二级联动菜单

发布时间：2016-10-19 编辑：jiaochengji.com

教程集为您提供城市二级联动菜单等资源，欢迎您收藏本站，我们将为您提供最新的城市二级联动菜单资源

提示：您可以先修改部分代码再运行

<textarea name="runcool" rows="28" cols="75" >城市二级联动菜单 <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>www.jiaochengji.com</title> <head> <body> <script type="text/javascript"> //定义了城市的二维数组，里面的顺序跟省份的顺序是相同的。通过selectedIndex获得省份的下标值来得到相应的城市数组www.jiaochengji.com var city=[ [["1_1","北京"],["1_2","天津"],["1_3","上海"],["1_4","重庆"],["1_5","香港"],["1_6","澳门"]], [["2_1","石家庄"],["2_2","唐山"],["2_3","秦皇岛"],["2_4","邯郸"],["2_5","邢台"],["2_6","保定"],["2_7","张家口"],["2_8","承德"],["2_9","沧州"],["2_10","廊坊"],["2_11","衡水"]], [["3_1","太原"],["3_2","大同"],["3_3","阳泉"],["3_4","长治"],["3_5","晋城"],["3_6","朔州"],["3_7","晋中"],["3_8","运城"],["3_9","忻州"],["3_10","临汾"],["3_11","吕梁"]], [["4_1","呼和浩特"],["4_2","包头"],["4_3","乌海"],["4_4","赤峰"],["4_5","通辽"],["4_6","鄂尔多斯"],["4_7","呼伦贝尔"],["4_8","巴彦淖尔"],["4_9","乌兰察布"],["4_10","兴安"],["4_11","锡林郭勒"],["4_12","阿拉善"]], [["5_1","沈阳"],["5_2","大连"],["5_3","鞍山"],["5_4","抚顺"],["5_5","本溪"],["5_6","丹东"],["5_7","锦州"],["5_8","营口"],["5_9","阜新"],["5_10","辽阳"],["5_11","盘锦"],["5_12","铁岭"],["5_13","朝阳"],["5_14","葫芦岛"]], [["6_1","长春"],["6_2","吉林"],["6_3","四平"],["6_4","辽源"],["6_5","通化"],["6_6","白山"],["6_7","松原"],["6_8","白城"],["6_9","延边"]], [["7_1","哈尔滨"],["7_2","齐齐哈尔"],["7_3","鸡西"],["7_4","鹤岗"],["7_5","双鸭山"],["7_6","大庆"],["7_7","伊春"],["7_8","佳木斯"],["7_9","七台河"],["7_10","牡丹江"],["7_11","黑河"],["7_12","绥化"],["7_13","大兴安岭"]], [["8_1","南京"],["8_2","苏州"],["8_3","扬州"],["8_4","无锡"],["8_5","徐州"],["8_6","常州"],["8_7","南通"],["8_8","连云港"],["8_9","淮安"],["8_10","盐城"],["8_11","镇江"],["8_12","泰州"],["8_13","宿迁"]], [["9_1","杭州"],["9_2","宁波"],["9_3","温州"],["9_4","嘉兴"],["9_5","湖州"],["9_6","绍兴"],["9_7","金华"],["9_8","衢州"],["9_9","舟山"],["9_10","台州"],["9_11","丽水"]], [["10_1","合肥"],["10_2","芜湖"],["10_3","蚌埠"],["10_4","淮南"],["10_5","马鞍山"],["10_6","淮北"],["10_7","铜陵"],["10_8","安庆"],["10_9","黄山"],["10_10","滁州"],["10_11","阜阳"],["10_12","宿州"],["10_13","巢湖"],["10_14","六安"],["10_15","亳州"],["10_16","池州"],["10_17","宣城"]], [["11_1","福州"],["11_2","宁德"],["11_3","南平"],["11_4","厦门"],["11_5","莆田"],["11_6","三明"],["11_7","泉州"],["11_8","漳州"]], [["12_1","南昌"],["12_2","上饶"],["12_3","萍乡"],["12_4","九江"],["12_5","景德镇"],["12_6","新余"],["12_7","鹰潭"],["12_8","赣州"],["12_9","吉安"],["12_10","宜春"],["12_11","抚州"]], [["13_1","济南"],["13_2","青岛"],["13_3","淄博"],["13_4","枣庄"],["13_5","东营"],["13_6","烟台"],["13_7","潍坊"],["13_8","威海"],["13_9","济宁"],["13_10","泰安"],["13_11","日照"],["13_12","莱芜"],["13_13","临沂"],["13_14","德州"],["13_15","聊城"],["13_16","滨州"],["13_17","菏泽"]], [["14_1","郑州"],["14_2","开封"],["14_3","洛阳"],["14_4","平顶山"],["14_5","焦作"],["14_6","鹤壁"],["14_7","新乡"],["14_8","安阳"],["14_9","濮阳"],["14_10","漯河"],["14_11","许昌"],["14_12","三门峡"],["14_13","南阳"],["14_14","商丘"],["14_15","信阳"],["14_16","周口"],["14_17","驻马店"]], [["15_1","武汉"],["15_2","十堰"],["15_3","襄樊"],["15_4","鄂州"],["15_5","黄石"],["15_6","荆州"],["15_7","宜昌"],["15_8","荆门"],["15_9","孝感"],["15_10","黄冈"],["15_11","咸宁"],["15_12","随州"],["15_13","恩施"]], [["16_1","长沙"],["16_2","株洲"],["16_3","湘潭"],["16_4","岳阳"],["16_5","邵阳"],["16_6","常德"],["16_7","衡阳"],["16_8","张家界"],["16_9","益阳"],["16_10","郴州"],["16_11","永州"],["16_12","怀化"],["16_13","娄底"],["16_14","湘西"]], [["17_1","广州"],["17_2","清远"],["17_3","潮州"],["17_4","东莞"],["17_5","珠海"],["17_6","深圳"],["17_7","汕头"],["17_8","韶关"],["17_9","佛山"],["17_10","江门"],["17_11","湛江"],["17_12","茂名"],["17_13","肇庆"],["17_14","惠州"],["17_15","梅州"],["17_16","汕尾"],["17_17","阳江"],["17_18","河源"],["17_19","中山"],["17_20","揭阳"],["17_21","云浮"]], [["18_1","南宁"],["18_2","柳州"],["18_3","桂林"],["18_4","梧州"],["18_5","北海"],["18_6","防城港"],["18_7","钦州"],["18_8","贵港"],["18_9","玉林"],["18_10","百色"],["18_11","贺州"],["18_12","河池"],["18_13","来宾"],["18_14","崇左"]], [["19_1","海口"],["19_2","三亚"]], [["20_1","成都"],["20_2","自贡"],["20_3","攀枝花"],["20_4","泸州"],["20_5","德阳"],["20_6","绵阳"],["20_7","广元"],["20_8","遂宁"],["20_9","内江"],["20_10","乐山"],["20_11","南充"],["20_12","宜宾"],["20_13","广安"],["20_14","达州"],["20_15","眉山"],["20_16","雅安"],["20_17","巴中"],["20_18","资阳"],["20_19","阿坝"],["20_20","甘孜"],["20_21","凉山"]], [["21_1","贵阳"],["21_2","六盘水"],["21_3","遵义"],["21_4","安顺"],["21_5","铜仁"],["21_6","毕节"],["21_7","黔西南"],["21_8","黔东南"],["21_9","黔南"]], [["22_1","昆明"],["22_2","曲靖"],["22_3","玉溪"],["22_4","保山"],["22_5","昭通"],["22_6","丽江"],["22_7","普洱"],["22_8","临沧"],["22_9","文山"],["22_10","红河"],["22_11","西双版纳"],["22_12","楚雄"],["22_13","大理"],["22_14","德宏"],["22_15","怒江"],["22_16","迪庆"]], [["23_1","拉萨"],["23_2","昌都"],["23_3","山南"],["23_4","日喀则"],["23_5","那曲"],["23_6","阿里"],["23_7","林芝"]], [["24_1","西安"],["24_2","铜川"],["24_3","宝鸡"],["24_4","咸阳"],["24_5","渭南"],["24_6","延安"],["24_7","汉中"],["24_8","榆林"],["24_9","安康"],["24_10","商洛"]], [["25_1","兰州"],["25_2","白银"],["25_3","定西"],["25_4","敦煌"],["25_5","嘉峪关"],["25_6","金昌"],["25_7","天水"],["25_8","武威"],["25_9","张掖"],["25_10","平凉"],["25_11","酒泉"],["25_12","庆阳"],["25_13","临夏"],["25_14","陇南"],["25_15","甘南"]], [["26_1","西宁"],["26_2","海东"],["26_3","海北"],["26_4","黄南"],["26_5","海南"],["26_6","果洛"],["26_7","玉树"],["26_8","海西"]], [["27_1","银川"],["27_2","石嘴山"],["27_3","吴忠"],["27_4","固原"],["27_5","中卫"]], [["28_1","乌鲁木齐"],["28_2","克拉玛依"],["28_3","吐鲁番"],["28_4","哈密"],["28_5","和田"],["28_6","阿克苏"],["28_7","喀什"],["28_8","克孜勒苏柯尔克孜"],["28_9","巴音郭楞蒙古"],["28_10","昌吉"],["28_11","博尔塔拉蒙古"],["28_12","伊犁哈萨克"],["28_13","阿勒泰"]], [["29_1","台北"],["29_2","高雄"],["29_3","基隆"],["29_4","台中"],["29_5","台南"],["29_6","新竹"],["29_7","嘉义"]] ]; function getCity(){ //获得省份下拉框的对象 var sltProvince=document.forms[0].province; //获得城市下拉框的对象 var sltCity=document.forms[0].city; //得到对应省份的城市数组 var provinceCity=city[sltProvince.selectedIndex - 1]; //清空城市下拉框，仅留提示选项 sltCity.length=1; //将城市数组中的值填充到城市下拉框中 for(var i=0;i<provinceCity.length;i ){ //获得城市名称值provinceCity[i][1] //获得城市名称的下标provinceCity[i][0] //如果都选值 sltCity[i 1]=new Option(provinceCity[i][1],provinceCity[i][1]); sltCity[i 1]=new Option(provinceCity[i][1],provinceCity[i][0]); } } <table> <tr><td>请选择企业所在城市*</td> <td><select name="province" onchange="getCity()"> <option value="null" selected="selected">请选择所在省份</option> <option value="1">直辖市</option> <option value="2">河北</option> <option value="3">山西</option> <option value="4">内蒙古</option> <option value="5">辽宁</option> <option value="6">吉林</option> <option value="7">黑龙江</option> <option value="8">江苏</option> <option value="9">浙江</option> <option value="10">安徽 </option> <option value="11">福建 </option> <option value="12">江西</option> <option value="13">山东</option> <option value="14">河南</option> <option value="15">湖北</option> <option value="16">湖南</option> <option value="17">广东</option> <option value="18">广西</option> <option value="19">海南</option> <option value="20">四川</option> <option value="21">贵州</option> <option value="22">云南</option> <option value="23">西藏</option> <option value="24">陕西 </option> <option value="25">甘肃 </option> <option value="26">青海</option> <option value="27">宁夏</option> <option value="28">新疆</option> <option value="29">台湾</option> </select> <select name="city"> <option selected="selected" value="null">请选择所在城市www.jiaochengji.com</option> </select> </td></tr> </table>

</body> </html></textarea>

提示：您可以先修改部分代码再运行

您可能感兴趣的文章：
javascript二级联动多选菜单实现程序
 javascript 省市二级联动菜单代码(select 联动)
js二级联动菜单
 js全国城市三级联动菜单代码
 javascrpit省市联动菜单代码
 js 二级联动菜单实现代码
 jquery 实现二级/三级/多级联动菜单的思路及代码
 js json省市二级联动菜单(json select)
二级联动菜单的js实现代码一例
 基于json的jquery地区联动效果代码

上一篇：javascript 经典的滑动门导航菜单代码下一篇：js 防爱房网城市切换效果

[关闭]

城市二级联动菜单

最近更新

浏览排行