不操作数据库，js解析json三级联动

1.后台转换成json写入js文件

    public function index()
    {
        // region_type     1 省份   2 城市   3 区县
        // 获取省  一维数组
        $arr1 = DB::table('region')->where('region_type',1)->get();
        foreach($arr1 as $k => $v){
            if($v->parent_id == 1){
                $province[$v->region_id] = $v->region_name;
            }
        }
        // print_R($province);die;
        
        //获取城市
        $arr2 = DB::table('region')->where('region_type',2)->get();
        foreach($arr2 as $k => $v){
            foreach($province as $kk => $vv){
                // $a[$v->region_id] = $v->region_name;
                if($v->parent_id == $kk){
                    $city[$kk][$v->region_id] = $v->region_name;
                    $cityId[$v->region_id] = $v->region_id;
                }
            }
        }
        // print_r($city);die;
        
        //获取县城
        $arr3 = DB::table('region')->where('region_type',3)->get();
        foreach($arr3 as $k => $v){
            foreach($cityId as $kk => $vv){
                if($v->parent_id == $vv){
                    $area[$kk][$v->region_id] = $v->region_name;
                }
            }
        }
        // print_R($area);die;

        $country['province'] = $province;
        $country['city'] = $city;
        $country['area'] = $area;
        // print_R($country);die;
        $filename = "area.js";
        file_put_contents($filename,"var json=".json_encode($country));
        return view('admin/Area');
    }

2.前台html代码

省份<select id="province" οnchange="province(this)">
            <option value="">--请选择--</option>
        </select>
        城市<select id="city" οnchange="city(this)">
            <option value="">--请选择--</option>
        </select>
        区/县<select id="area">
            <option value="">--请选择--</option>
        </select>

3.js代码

<script src="{{URL::asset('/')}}area.js"></script>
<script src="js/jquery.js"></script>
<script>
        var json = eval(json);
        var str = '<option value="">--请选择--</option>';
        for(i in json.province){
            str += '<option value="'+i+'">'+json.province[i]+'</option>';
        }
        $("#province").html(str);
        $("#city").html('<option value="">--请选择--</option>');
    //根据省份查询出城市
    function province(p_id){
        var p_id = $(p_id).val();
        var st = '<option value="">--请选择--</option>';
            for( a in json.city[p_id]){
                st += '<option value="'+a+'">'+json.city[p_id][a]+'</option>';
            }
        $("#city").html(st);
        $("#area").html('<option value="">--请选择--</option>');
    }
    // 根据城市查询出区/县
    function city(c_id){
        var c_id = $(c_id).val();
        var sr = '<option value="">--请选择--</option>';
            for( a in json.area[c_id]){
                sr += '<option value="'+a+'">'+json.area[c_id][a]+'</option>';
            }
        $("#area").html(sr);
    }
</script>