简易的省市二级联动

最新推荐文章于 2019-01-19 20:16:27 发布

flyflyfly88

最新推荐文章于 2019-01-19 20:16:27 发布

阅读量183

点赞数

本文链接：https://blog.csdn.net/flyflyfly88/article/details/77014676

版权

<head>
    <meta charset="UTF-8">
    <title></title>
    <script>
        var shenArr = new Array(); //声明数组
        shenArr["广东"] = ["广州","深圳","珠海","汕头"];
        shenArr["湖南"] = ["长沙","株洲","张家界","邵阳"];
        shenArr["湖北"] = ["武汉","宜昌","荆州","仙桃"];
        shenArr["安徽"] = ["合肥","黄山"];
        shenArr["河南"] = ["郑州","洛阳"];

        function getShen() {
            var s = document.getElementById("shen");
            for(var v in shenArr) {
                //document.write(arr[v] + "<br/>");
                s.add(new Option(v,v),null);//把数组键加入到省的下拉框中
            }
        }

        function getCity(){
            var s = document.getElementById("shen"); //省下拉框
            var c = document.getElementById("city"); // 市下拉框
            var v = s.value; //省市名称，也是数组中的键

            c.options.length=0;//清除当前city中的选项
            //循环把某一个省的城市加入到市的下拉框
            for(var i in shenArr[v]){
                c.add(new Option(shenArr[v][i]),null);
            }
        }
    </script>
</head>

<body onload="getShen()">
    省：<select id="shen" onchange="getCity()">
        <option value="0">--请选择--</option>
    </select>

    市：<select id="city"></select>
</body>

flyflyfly88

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
简易的省市二级联动

<head> <meta charset="UTF-8"> <title></title> <script> var shenArr = new Array(); //声明数组 shenArr["广东"] = ["广州","深圳","珠海","汕头"]; shenArr["湖南"] = ["长沙","株洲","张家界","邵阳"
复制链接

扫一扫