php地址级联递归为json

1.首先从数据库获取region表的地址信息，并且把结果转化为json格式。

 

 

 2.对数据库查询到的结果进行递归，转化为地址的树结构，其中用过后的键应立即销毁，不然严重占用内存，会报内存不够的错误

 

 3.以上生成的json数据可以保存为json文件，也可以直接使用，前端调用json文件的完整代码

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1 user-scalable=no maximum-scale=1.0"  />
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>动像</title>
    <meta name="keywords" content="{$site_seo_keywords}" />
    <meta name="description" content="{$site_seo_description}">
    <link rel="stylesheet" type="text/css" href="__PUBLIC__/style/skins/all.css" />
    <link rel="stylesheet" type="text/css" href="__PUBLIC__/style/style.css" />
    <link rel="stylesheet" type="text/css" href="__PUBLIC__/style/member.css">
    <link rel="stylesheet" href="__PUBLIC__/style/font-awesome.min.css">
    <link rel="stylesheet" href="__PUBLIC__/style/swiper.css">
    <script type="text/javascript" src="__PUBLIC__/js/jquery-1.8.3.js"></script>
    <script type="text/javascript" src="__PUBLIC__/js/swiper.jquery.min.js"></script>
    <script type="text/javascript" src="__PUBLIC__/js/touchScroll.js"></script>
    <script type="text/javascript" src="__PUBLIC__/js/icheck.min.js"></script>
    <script type="text/javascript" src="__PUBLIC__/js/city.js"></script>
    <script type="text/javascript" src="__PUBLIC__/js/area.js"></script>
    <script type="text/javascript" src="__PUBLIC__/js/js.js"></script>
    <script type="text/javascript" src="__ROOT__/statics/js/zt/js_zt.js"></script>
    <script type="text/javascript" src="__PUBLIC__/js/regiontest.js"></script><!--数据源文件-->
</head>
<body>
省：<select id="province"><option>请选择</option></select>
市：<select id="city"></select>
区：<select id="area"></select>
<div id="submit">查看</div>
</body>
<script src="__PUBLIC__/js/vue.js"></script>
<script src="__PUBLIC__/js/element-ui@2.13.2/index.js"></script>
<script src="__PUBLIC__/js/basicInfo.js"></script>
<script type="text/javascript">
    $(document).ready(function(){

        //操作DOM，加载数据到下拉列表 foreach
        $.each(data,function(index,item){ //循环data数据中每一个
            $("#province").append("<option value="+index+">"+item.name+"</option>");

        });

        //点击不同的省，加载市
        $("#province").bind("change",function(){
            //得到哪个省被点击

            var province = $(this).val();//得到当前省份
            var city = data[province].child;//得到当前省份的所有城市
            //加载该省的数据

            $("#city").empty();//重新选择省时候清空城市列表
            $("#area").empty();//重新选择省时候清空区列表
            $("#city").append("<option>请选择</option>");
            $.each(city,function(index2,item){

                $("#city").append("<option value="+index2+">"+item.name+"</option>");

            });

        });

        $("#city").bind("change",function(){

            $("#area").empty();//重新选择城市时候清空区列表
            $("#area").append("<option>请选择</option>");

            var province = $("#province").val(); //得到当前省
            var citynum = $(this).val();//得到当前城市
            var are = data[province].child[citynum].child; //得到当前城市所对应的城区

            $.each(are,function(index3,item){
                $("#area").append("<option value="+item.name+">"+item.name+"</option>");
            });
        });
    });
</script>
</html>

 

posted @ 2021-09-23 18:28  学习园地-温故而知新  阅读(51)  评论(0)    收藏  举报