jQuery ajax省市区四级联动

$(function(){
    query();
    //获取到市
    $('#province').change(function(){
        var id = $('#province').val();
        $.ajax({
            url:'/user/selectp?rootid='+id,
            type:'GET',
            dataType:'json',
            success:function(data){
                var content = '<option>市</option>';
                for (var i in data) {    
                    content += '<option value='+data[i].AreaID+'>'+data[i].AreaName+'</option>';
                }
                $('#city').html(content);
                $('#county').html('<option>县/区</option>');
                $('#street').html('<option>街道</option>');
            }
            
        })
    })
    
    //获取到县/区
    $('#city').change(function(){
        var id = $('#city').val();
        $.ajax({
            url:'/user/selectp?rootid='+id,
            type:'GET',
            dataType:'json',
            success:function(data){
                var content = '<option>县/区</option>';
                for (var i in data) {    
                    content += '<option value='+data[i].AreaID+'>'+data[i].AreaName+'</option>';
                }
                $('#county').html(content);
                $('#street').html('<option>街道</option>');
            }
            
        })
    })
    //获取到街道
    $('#county').change(function(){
        var id = $('#county').val();
        $.ajax({
            url:'/user/selectp?rootid='+id,
            type:'GET',
            dataType:'json',
            success:function(data){
                var content = '<option>街道</option>';
                for (var i in data) {    
                    content += '<option value='+data[i].AreaID+'>'+data[i].AreaName+'</option>';
                }
                $('#street').html(content);
            }
            
        })
    })
    
})


//获取到省份
function query(){
    var id = 0;
    $.ajax({
        url:'/user/selectp?rootid='+id,    
        type:'GET',
        dataType:'json',
        success:function(data){
            var content = '<option>省</option>';
            for (var i in data) {    
                content += '<option value='+data[i].AreaID+'>'+data[i].AreaName+'</option>';
            }
            $('#province').html(content);
        }
    })
}

 

posted @ 2015-09-22 13:45  U丶Zero  阅读(1476)  评论(0编辑  收藏  举报