JS中简单的二级城市联动

代码奉上:

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>二级城市联动</title>
</head>
<body>
    <select id="one" onchange="func(this.value)">
        <option value="">--请选择--</option>
        <option value="0">浙江省</option>
        <option value="1">广东省</option>
        <option value="2">福建省</option>
    </select>
    <select id="two">
        <option value="">--请选择--</option>
    </select>
</body>
<script>
    var two = document.getElementById('two');
    city = [];//申明

  //定义二级数据 正常应该是一个全国的json
    city[0] = ['杭州市'];
    city[1] = ['广州市'];
    city[2] = ['厦门市'];
    function func(m){
        two.length = 1;

      //遍历生产option选项
        for (var i = 0; i < city[m].length; i++) {

        //创建一个option 把数据存储在option 
            var op = new Option(city[m][i],i);

       //把带有数据的option 添加到第二个select
            two.add(op);
        };
    }
</script>
</html>

简单 简单 简单 重要的事说三遍, 三级联动可以依葫芦画瓢写出来

posted @ 2017-10-17 22:11  抠脚码农  阅读(20823)  评论(4编辑  收藏  举报