zoukankan      html  css  js  c++  java
  • 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);
            }
        })
    }
  • 相关阅读:
    接口的多实现。
    接口的基本实现。
    构建MVC解决方案(包含哪些项目)
    书目记录
    Chrome浏览器修改user-agent,伪装其他浏览器,附带微信、支付宝user-agent
    [文件]学生信息的简单读入与输出
    scanf高级用法【至此丢弃gets用法 】
    数组,字符串
    [转载]终极解密输入网址按回车到底发生了什么
    typedef 和 #define 的区别
  • 原文地址:https://www.cnblogs.com/sisl/p/4828731.html
Copyright © 2011-2022 走看看