全国省市区三级联动(PHP+jQuery)

全国省市区三级联动 (PHP+jQuery)

PHP+jQuery

目录

Javascript: 1

PHP: 2

Html 3

Sql: 3

 

 

 

Javascript:

jQuery: http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js

 

    < script type ="text/javascript">

        $( function (){

            var url_province = "" ;

            $( '#province' ).empty() ;

            $( '#province' ).append( ' 请选择 ' ) ;

            $.getJSON(url_province, function (json){

                $(json).each( function (i){

                   // alert(json[i].id) ;

                    var option = '+json[i].code+ '">' +json[i].name+ '' ;

                    $( '#province' ).append(option);

                });

            });

        }) ;

       

        function getCity(code){

           

            var url_city = "" ;

            $( '#city' ).empty() ;

            $( '#city' ).append( ' 请选择 ' ) ;

            //alert(code) ;

            $.getJSON(url_city,{ 'code' :code}, function (json){

                $(json).each( function (i){

                    var option = '+json[i].code+ '">' +json[i].name+ '' ;

                    $( '#city' ).append(option);

                });

            });

        }

       

        function getArea(code){

            var url_area = "" ;

            $( '#area' ).empty() ;

            $( '#area' ).append( ' 请选择 ' ) ;

            $.getJSON(url_area,{ 'code' :code}, function (json){

                $(json).each( function (i){

                    var option = '+json[i].code+ '">' +json[i].name+ '' ;

                    $( '#area' ).append(option);

                });

            });

        }

 

PHP:

(FleaPHP 框架 )

 

    function actionProvince(){

        $tableProvince = FLEA::getSingleton( 'Table_Province' );

        $province = $tableProvince ->findAll() ;

        //$this->_data['province'] = $province ;

        echo json_encode( $province ) ;

    }

   

    function actionCity(){

        $provinceCode = $_REQUEST [ 'code' ] ;

        $tableCity = FLEA::getSingleton( 'Table_City' );

        $conditions = "" ;

        if (! empty ( $provinceCode )){

            $conditions .= "provincecode = " . $provinceCode ;

        }

        $city = $tableCity ->findAll( $conditions ) ;

       

        echo json_encode( $city ) ;

    }

   

    function actionArea(){

        $cityCode = $_REQUEST [ 'code' ] ;

        $tableArea = FLEA::getSingleton( 'Table_Area' );

        $conditions = "" ;

        if (! empty ( $cityCode )){

            $conditions .= "citycode = $cityCode " ;

        }

        $area = $tableArea ->findAll( $conditions ) ;

        echo json_encode( $area ) ;

    }

 

Html :

  < select name ="province" id ="province" onchange ="javascript:getCity(this.options[this.selectedIndex].value);">

  < option value ="-1"> 请选择 option >

  select > br >

  < label for =" 城市 "> 城市 label >

  < select name ="city" id ="city" onchange ="javascript:getArea(this.options[this.selectedIndex].value);">

  < option value ="-1"> 请选择 option >

  select > br >

  < label for =" 区 "> 区 label >

  < select name ="area" id ="area">

  < option value ="-1"> 请选择 option >

  select > br >

 

Sql:略

 

文档下载：    http://download.csdn.net/source/3400102