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

PHP+jQuery

目录

Javascript:

PHP:

Html

Sql:

 

 

 

Javascript:

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

 

    < script type ="text/javascript">

        $( function (){

            var url_province = "<?php echo url('admin','province')?>" ;

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

            $( '#province' ).append( '<option value="-1"> 请选择 </option>' ) ;

            $.getJSON(url_province, function (json){

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

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

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

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

                });

            });

        }) ;

       

        function getCity(code){

           

            var url_city = "<?php echo url('admin','city')?>" ;

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

            $( '#city' ).append( '<option value="-1"> 请选择 </option>' ) ;

            //alert(code) ;

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

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

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

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

                });

            });

        }

       

        function getArea(code){

            var url_area = "<?php echo url('admin','area')?>" ;

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

            $( '#area' ).append( '<option value="-1"> 请选择 </option>' ) ;

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

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

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

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

                });

            });

        }

</script>

 

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