ajax省市区联动selec2
$(function () {
        // 初始化省市区
        initAddress();
        // 更改省份后的操作
        $("select[name='province']").change(function() {
            var provCode = $("select[name='province']").val();
            getCity(provCode);
        });
        // 更改城市后的操作
        $("select[name='city']").change(function() {
            var cityCode = $("select[name='city']").val();
            getArea(cityCode);
        });
    function initAddress() {
        var firstProvCode;
        // ajax请求所有省份
            $.ajax({
                type:"post",
                url:"../js/json.json",
                data:{"id":"id"},
                dataType:"json",
                success: function (data) { //返回json结果
                    $.each(data, function(i, d) {
                        $("select[name='province']").append(
                            "<option value='"+d.id+"'>" + d.name
                            + "</option>");
                    });
                    // 获取第一个省份的code
                    firstProvCode = data[0].id;
                    // 根据第一个省份code获取对应城市列表
                    // getCity(firstProvCode);'/
                }
            })
    }

    //获取对应城市列表(里面包括获取第一个城市的区县列表)
    function getCity() {
        var firstCityCode;
        // ajax请求所有市级单位
        $.ajax({
            type:"post",
            url:"../js/city.json",
            data:{"id":"id"},
            dataType:"json",
            success: function (data) { //返回json结果
                // 先清空城市下拉框
                $("select[name='city']").empty();
                $.each(data, function(i, d) {
                    $("select[name='city']").append(
                        "<option value='"+d.id+"'>" + d.name
                        + "</option>");
                });
                // 获取第一个城市的code
                firstCityCode = data[0].id;
                // 根据第一个城市code获取对应区县列表
                getArea(firstCityCode);
            }
        })
    }
    function getArea(cityCode) {
        // ajax请求所有区县单位
        $.ajax({
            type:"post",
            url:"../js/area.json",
            data:{"id":"id"},
            dataType:"json",
            success: function (data) { //返回json结果
                // 先清空区县下拉框
                $("select[name='area']").empty();
                $.each(data, function(i, d) {
                    $("select[name='area']").append(
                        "<option value='"+d.id+"'>" + d.name
                        + "</option>");
                });
            }
        })
    }
    $(".select-address").select2({
        width: 'resolve'
    })
})
阅读更多
版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/cheeso/article/details/80335126
个人分类: 前端代码
想对作者说点什么? 我来说一句

jquery+ajax+json省市区三级联动

2012年07月13日 218KB 下载

没有更多推荐了,返回首页

不良信息举报

ajax省市区联动selec2

最多只允许输入30个字

加入CSDN,享受更精准的内容推荐,与500万程序员共同成长!
关闭
关闭