省市2级联动

<html>
<head>
    <script src="http://common.cnblogs.com/script/jquery.js" type="text/javascript"></script>
    <SCRIPT LANGUAGE="JavaScript">
        var Items = new Array();
        function add(id, iArray) {
            Items[id] = iArray;
        }
        add(0, ["1:北京市", "2:天津市", "3:河北省", "4:山西省", "5:内蒙古", "6:辽宁省", "7:吉林省", "8:黑龙江省", "9:上海市", "10:江苏省", "11:浙江省", "12:安徽省", "13:福建省", "14:江西省", "15:山东省", "16:河南省", "17:湖北省", "18:湖南省", "19:广东省", "20:广西自治区", "21:海南省", "22:重庆市", "23:四川省", "24:贵州省", "25:云南省", "26:西藏自治区", "27:陕西省", "28:甘肃省", "29:青海省", "30:宁夏回族自治区", "31:新疆维吾尔自治区", "32:香港特别行政区", "33:澳门特别行政区", "34:台湾省", "35:其它"]);
        add(1, ["1:北京", "2:东城区", "3:西城区", "4:崇文区", "5:宣武区", "6:朝阳区", "7:丰台区", "8:石景山区", "9: 海淀区(中关村)", "10:门头沟区", "11:房山区", "12:通州区", "13:顺义区", "14:昌平区", "15:大兴区", "16:怀柔区", "17:平谷区", "18:密云县", "19:延庆县", "20: 其他"]);
        add(2, ["1:和平区", "2:河东区", "3:河西区", "4:南开区", "5:红桥区", "6:塘沽区", "7:汉沽区", "8:大港区", "9:西青区", "10:津南区", "11:武清区", "12:蓟县", "13:宁河县", "14:静海县", "15:其他"]);
        add(3, ["1:石家庄市", "2:张家口市", "3:承德市", "4:秦皇岛市", "5:唐山市", "6:廊坊市", "7:衡水市", "8:沧州市", "9:邢台市", "10:邯郸市", "11:保定市", "12:其他"]);
        add(4, ["1:太原市", "2:朔州市", "3:大同市", "4:长治市", "5:晋城市", "6:忻州市", "7:晋中市", "8:临汾市", "9:吕梁市", "10:运城市", "11:其他"]);
        add(5, ["1:呼和浩特市", "2:包头市", "3:赤峰市", "4:呼伦贝尔市", "5:鄂尔多斯市", "6:乌兰察布市", "7:巴彦淖尔市", "8:兴安盟", "9:阿拉善盟", "10:锡林郭勒盟", "11:其他"]);
        add(6, ["1:沈阳市", "2:朝阳市", "3:阜新市", "4:铁岭市", "5:抚顺市", "6:丹东市", "7:本溪市", "8:辽阳市", "9:鞍山市", "10:大连市", "11:营口市", "12:盘锦市", "13:锦州市", "14:葫芦岛市", "15:其他"]);
        add(7, ["1:长春市", "2:白城市", "3:吉林市", "4:四平市", "5:辽源市", "6:通化市", "7:白山市", "8:延边朝鲜族自治州", "9:其他"]);
        add(8, ["1:哈尔滨市", "2:七台河市", "3:黑河市", "4:大庆市", "5:齐齐哈尔市", "6:伊春市", "7:佳木斯市", "8:双鸭山市", "9:鸡西市", "10:大兴安岭地区(加格达奇)", "11:牡丹江", "12:鹤岗市", "13:绥化市 ", "14:其他"]);
        add(9, ["1:黄浦区", "2:卢湾区", "3:徐汇区", "4:长宁区", "5:静安区", "6:普陀区", "7:闸北区", "8:虹口区", "9:杨浦区", "10:闵行 区", "11:宝山区", "12:嘉定区", "13:浦东新区", "14:金山区", "15:松江区", "16:青浦区", "17:南汇区", "18:奉贤区", "19:崇明县", "20:其他"]);
        add(10, ["1:南京市", "2:徐州市", "3:连云港市", "4:宿迁市", "5:淮安市", "6:盐城市", "7:扬州市", "8:泰州市", "9:南通市", "10:镇江市", "11:常州市", "12:无锡市", "13:苏州市", "14:其他"]);
        add(11, ["1:杭州市", "2:湖州市", "3:嘉兴市", "4:舟山市", "5:宁波市", "6:绍兴市", "7:衢州市", "8:金华市", "9:台州市", "10:温州市", "11:丽水市", "12:其他"]);
        add(12, ["1:合肥市", "2:宿州市", "3:淮北市", "4:亳州市", "5:阜阳市", "6:蚌埠市", "7:淮南市", "8:滁州市", "9:马鞍山市", "10:芜湖市", "11:铜陵市", "12:安庆市", "13:黄山市", "14:六安市", "15:巢湖市", "16:池州市", "17:宣城市", "18:其他"]);
        add(13, ["1:福州市", "2:南平市", "3:莆田市", "4:三明市", "5:泉州市", "6:厦门市", "7:漳州市", "8:龙岩市", "9:宁德市", "10:其他"]);
        add(14, ["1:南昌市", "2:九江市", "3:景德镇市", "4:鹰潭市", "5:新余市", "6:萍乡市", "7:赣州市", "8:上饶市", "9:抚州市", "10:宜春市", "11:吉安市", "12:其他"]);
        add(15, ["1:济南市", "2:聊城市", "3:德州市", "4:东营市", "5:淄博市", "6:潍坊市", "7:烟台市", "8:威海市", "9:青岛市", "10:日照市", "11:临沂市", "12:枣庄市", "13:济宁市", "14:泰安市", "15:莱芜市", "16:滨州市", "17:菏泽市", "18:其他"]);
        add(16, ["1:郑州市", "2:三门峡市", "3:洛阳市", "4:焦作市", "5:新乡市", "6:鹤壁市", "7:安阳市", "8:濮阳市", "9:开封市", "10:商丘市", "11:许昌市", "12:漯河市", "13:平顶山市", "14:南阳市", "15:信阳市", "16:周口市", "17:驻马店市", "18:其他"]);
        add(17, ["1:武汉市", "2:十堰市", "3:襄樊市", "4:荆门市", "5:孝感市", "6:黄冈市", "7:鄂州市", "8:黄石市", "9:咸宁市", "10:荆 州市", "11:宜昌市", "12:随州市", "13:恩施土家族苗族自治州", "14:仙桃市", "15:天门市", "16:潜江市", "17:神农架林区", "18:其他"]);
        add(18, ["1:长沙市", "2:张家界市", "3:常德市", "4:益阳市", "5:岳阳市", "6:株洲市", "7:湘潭市", "8:衡阳市", "9:郴州市", "10:永州市", "11:邵阳市", "12:怀化市", "13:娄底市", "14:湘西土家族苗族自治州", "15:其他"]);
        add(19, ["1:广州市", "2:清远市市", "3:韶关市", "4:河源市", "5:梅州市", "6:潮州市", "7:汕头市", "8:揭阳市", "9:汕尾市", "10: 惠州市", "11:东莞市", "12:深圳市", "13:珠海市", "14:中山市", "15:江门市", "16:佛山市", "17:肇庆市", "18:云浮市", "19:阳江市", "20:茂名市", "21:湛江市", "22: 其他"]);
        add(20, ["1:南宁市", "2:桂林市", "3:柳州市", "4:梧州市", "5:贵港市", "6:玉林市", "7:钦州市", "8:北海市", "9:防城港市", "10:崇左市", "11:百色市", "12:河池市", "13:来宾市", "14:贺州市", "15:其他"]);
        add(21, ["1:海口市", "2:三亚市", "3:其他"]);
        add(22, ["1:渝中区", "2:大渡口区", "3:江北区", "4:沙坪坝区", "5:九龙坡区", "6:南岸区", "7:北碚区", "8:万盛区", "9:双桥 区", "10:渝北区", "11:巴南区", "12:万州区", "13:涪陵区", "14:黔江区", "15:长寿区", "16:合川市", "17:永川市", "18:江津市", "19:南川市", "20:綦江县", "21:潼南 县", "22:铜梁县", "23:大足县", "24:璧山县", "25:垫江县", "26:武隆县", "27:丰都县", "28:城口县", "29:开县", "30:巫溪县", "31:巫山县", "32:奉节县", "33:云阳 县", "34:忠县", "35:石柱土家族自治县", "36:彭水苗族土家族自治县", "37:酉阳土家族苗族自治县", "38:秀山土家族苗族自治县", "39:其他"]);
        add(23, ["1:成都市", "2:广元市", "3:绵阳市", "4:德阳市", "5:南充市", "6:广安市", "7:遂宁市", "8:内江市", "9:乐山市", "10:自 贡市", "11:泸州市", "12:宜宾市", "13:攀枝花市", "14:巴中市", "15:资阳市", "16:眉山市", "17:雅安", "18:阿坝藏族羌族自治州", "19:甘孜藏族自治州", "20:凉山彝 族自治州县", "21:其他"]);
        add(24, ["1:贵阳市", "2:六盘水市", "3:遵义市", "4:安顺市", "5:毕节地区", "6:铜仁地区", "7:黔东南苗族侗族自治州", "8:黔南布依族苗族自治州", "9:黔西南布依族苗族自治州", "10:其他"]);
        add(25, ["1:昆明市", "2:曲靖市", "3:玉溪市", "4:保山市", "5:昭通市", "6:丽江市", "7:普洱市", "8:临沧市", "9:宁德市", "10:德 宏傣族景颇族自治州", "11:怒江傈僳族自治州", "12:楚雄彝族自治州", "13:红河哈尼族彝族自治州", "14:文山壮族苗族自治州", "15:大理白族自治州", "16:迪庆藏族 自治州", "17:西双版纳傣族自治州", "18:其他"]);
        add(26, ["1:拉萨市", "2:那曲地区", "3:昌都地区", "4:林芝地区", "5:山南地区", "6:日喀则地区", "7:阿里地区", "8:其他"]);
        add(27, ["1:西安市", "2:延安市", "3:铜川市", "4:渭南市", "5:咸阳市", "6:宝鸡市", "7:汉中市", "8:安康市", "9:商洛市", "10:其他"]);
        add(28, ["1:兰州市 ", "2:嘉峪关市", "3:金昌市", "4:白银市", "5:天水市", "6:武威市", "7:酒泉市", "8:张掖市", "9:庆阳市", "10:平凉市", "11:定西市", "12:陇南市", "13:临夏回族自治州", "14:甘南藏族自治州", "15:其他"]);
        add(29, ["1:西宁市", "2:海东地区", "3:海北藏族自治州", "4:黄南藏族自治州", "5:玉树藏族自治州", "6:海南藏族自治州", "7:果洛藏族自治州", "8:海西蒙古族藏族自治州", "9:其他"]);
        add(30, ["1:银川市", "2:石嘴山市", "3:吴忠市", "4:固原市", "5:中卫市", "6:其他"]);
        add(31, []);
        add(32, ["1:香港岛", "2:九龙", "3:新界", "4:其他"]);
        add(33, ["1:澳门半岛", "2:澳门离岛", "3:其他"]);
        add(34, ["1:基隆", "2:新竹", "3:台中", "4:嘉义", "5:台南", "6:其他"]);
        add(35, []);

        var selpoc = $("<option value=-1>选择省份</option>");
        var selcty = $("<option value=-1>选择城市</option>");

        function initProvinceCity(provinceSel, citySel) {
            provinceSel.append(selpoc.clone());
            provinceSel.append(createOptions(Items[0]));
            provinceSel.change(function () {
                if ($(this).val() == -1)
                    citySel.html(selcty.clone().html());
                else {
                    citySel.html("").append(selcty.clone());
                    citySel.append(createOptions(Items[$(this).val()]));
                }
            });
            citySel.append(selcty.clone());
        }
        function createOptions(cs) {
            var options = "";
            for (var i = 0; i < cs.length; i++) {
                var temp = "<option value=";
                temp += cs[i].split(":")[0] + ">" + cs[i].split(":")[1] + "</option>";
                options += temp;
            }
            return $(options);
        }
        function getProvinceCity(p_c) {
            var pid = parseInt(p_c.split("_")[0]);
            var cid = parseInt(p_c.split("_")[1]);
            var pv = Items[0][pid].split(":")[1];
            var cv = Items[pid][cid].split(":")[1];
            return pv + "_" + cv;
        }
        //初始化
        $("document").ready(function () {
            initProvinceCity($("#p1"), $("#c1"));
        });


    </SCRIPT>
</head>
<body>
所在地:省份:
<select name="p1" id="p1" style="width:100px;"></select>
市/区:
<select name="c1" id="c1"></select>

</body>
</html>

 

posted @ 2017-03-20 15:12  佳琪欧尼  阅读(266)  评论(0编辑  收藏  举报