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);
            }
        })
    }
  • 相关阅读:
    #pragma
    I/0概念介绍
    Android Eclipse 源码工程 调试
    SHELL四则运算和比较
    Android源码中添加 修改应用
    android ubuntu9.10 源码的编译 Eclipse工程 Contacts编译 应用加载
    【Wonder原创】LogMiner使用实践
    【转】Oracle入门教程,新手必读
    【Wonder原创】关于MSSQL通过DBLink访问Oracle问题
    【杂记】SQLServer
  • 原文地址:https://www.cnblogs.com/sisl/p/4828731.html
Copyright © 2011-2022 走看看