城市--区域--二级联动--后台获取数据--mui组件-picker

//前台根据parent_id获得城市列表
            var shengNums="";
            var cityNums="";
            var parent_id=2;//2为北京城区，20为天津
            //获取所有的城市级信息
            function sheng(){
                mui.ajax(url+"/front_get_citys.do?id="+parent_id, {
                    type: "GET",
                    async:false,
                    dataType: "jsonp",
                    success: function(data) {
                    //console.log("获取省信息成功");
                        var json_data = jQuery.parseJSON(data);
                        console.log(json_data.t_areas.length);
                        cityNums=json_data.t_areas.length;
                        ShangQuan();
                        var str ="";
                        for(var i = 0;i<json_data.t_areas.length;i++ ){
                            //console.log(json_data.list[i].name);
                            //roledata1+="[{value:'"+ json_data.list[i].id+"',text:'"+json_data.list[i].name+"'}]";
                            //因为picker下拉框是数组-要进行数据格式化
                            if(i+1!=json_data.t_areas.length){
                                    str+="{value:'"+ json_data.t_areas[i].id+"',text:'"+json_data.t_areas[i].area_name+"',children:"+arr[i]+"}"
                                }
                                if(i+2!=json_data.t_areas.length){
                                    str+=",";
                                }
                                
                            }
                        shengdata="["+str+"]";
                        //console.log(quyudata);
                    /*shengNums="[{value:'"+ json_data.t_areas[0].id+"',text:'"+json_data.t_areas[0].area_name+"',children:"+quyudata+"},"+
                    "{value:'"+ json_data.t_areas[1].id+"',text:'"+json_data.t_areas[1].area_name+"',children:"+quyudata+"}]";//数据格式化*/
                        //quyudata="[{value: '120000',text: '北京市',children:"+"["+str+"]"+"}]";//数据格式化
                        //localStorage.setItem("shengdata",shengdata); 
                    },
                    error: function(xhr, type, errorThrown) {
                    //异常处理；
                    mui.toast("查询失败-暂时无法访问"); 
                    }
                });
            }
            //监听选取二级联动
            var dizhiid="";
            var ditieButton=document.getElementById('dizhi');
            ditieButton.addEventListener('tap', function(event) {
                        dizhiPicker.setData(eval(shengdata));//循环取值
                        dizhiPicker.show(function(items) {
                        //var name=JSON.stringify(items[0].text).replace("\"","").replace("\"","");
                        var name2=JSON.stringify(items[1].text).replace("\"","").replace("\"","");
                        dizhiid=JSON.stringify(items[1].value).replace("\"","").replace("\"","");    
                            $("#dizhi").html(name2);
                        refreshData();
                        });
                    }, false);
            mui("body").on("tap",".mui-poppicker-btn-cancel",function(){
            //console.log("点击了取消");
            dizhiid="";    //重置向后台传递的参数为null
            $("#dizhi").html("Location");//样式恢复到原来的状态
            refreshData();
            });
            
            
            var arr=[];
            //获取区域名称front_get_bussinessestow.do?province_code=1&city_code=2&area_code=3
            function ShangQuan(){
                console.log("多少个城市"+cityNums);
                for(var areaid=3;areaid<=cityNums;areaid++){
                    mui.ajax(url+"/front_get_bussinessestow.do", {
                    type: "GET",
                    async:false,
                    dataType: "jsonp",
                    data:{
                        province_code:1,
                        city_code:2,
                        area_code:areaid,
                    },
                    success: function(data) {
                    //console.log("获取商圈信息成功");
                        var json_data = jQuery.parseJSON(data);
                        //console.log(json_data.list.length);
                        var str1 ="";
                        for(var i = 0;i<json_data.list.length;i++ ){
                            //console.log(json_data.list[i].name);
                            //roledata1+="[{value:'"+ json_data.list[i].id+"',text:'"+json_data.list[i].name+"'}]";
                            //因为picker下拉框是数组-要进行数据格式化
                            if(i+1!=json_data.list.length){
                                    str1+="{value:'"+ json_data.list[i].id+"',text:'"+json_data.list[i].name+"'}"
                                }
                                if(i+2!=json_data.list.length){
                                    str1+=",";
                                }
                            }
                        var quyudata="";
                        quyudata="["+str1+"]";//数据格式化
                        arr.push(quyudata);
                        //console.log(quyudata);
                        //localStorage.setItem("shengdata",shengdata); 
                    },
                    error: function(xhr, type, errorThrown) {
                    //异常处理；
                    mui.toast("查询失败-暂时无法访问"); 
                    }
                });
                //console.log(quyudata);
                    
                }
                //console.log(arr[1]);
                
            }

转载于:https://www.cnblogs.com/fdxjava/articles/11358595.html