var AREA_LIST = [{ value: 'school', label: '学校' }, { value: 'apartment', label: '公寓' }, { value: 'workshop', label: '厂房' }, { value: 'others', label: '其他' }]; function CreateCitySelect(option, callback) { var cityPicker var areaPicker function initUI() { //地区 cityPicker = new mui.PopPicker({ layer: 3 }); var showCity = document.getElementById('location'); var districtId = document.getElementById('districtId'); showCity.addEventListener('tap', function (event) { cityPicker.show(function (items) { showCity.value = (items[0] || {}).text + " " + (items[1] || {}).text + " " + (items[2] || {}).text; districtId.value = items[2].value; }); }, false); //地址类型 areaPicker = new mui.PopPicker(); var showArea = document.getElementById('area'); var addressType = document.getElementById('addressType'); showArea.addEventListener('tap', function (event) { areaPicker.show(function (items) { showArea.value = (items[0] || {}).text; addressType.value = (items[0] || {}).value; }); }, false); } function setAreaTypeData() { sendRequest({ url: '/common/getAddressType', type: "GET", data: {}, success: function (res) { if (res.result === 1) { AREA_LIST = res.payload.dataList for(var index in AREA_LIST){ var item = AREA_LIST[index]; item.text = item.label } areaPicker.setData(AREA_LIST); // 当地址类型初始化完成后,调用回调,待优化,地址类型和地址分开最好 if(callback){ callback() } } } }) } function setAddressData() { if (window.cityData3) { } else { return; } cityPicker.setData(cityData3);//加载cityData json数据 } function setAddressSelected(option) { var addressComponents = option.addressComponents; var areaId = option.areaId; var idMap = {}; if (addressComponents) { //地址新增页面 idMap = getIdMapByDistrict(addressComponents) || {}; //由于地图数据更新快,或是我们使用的数据不全,有一定几率找不到地区信息,不用渲染到界面 if (!$.isEmptyObject(idMap)) { $("#location").val(idMap.province + " " + idMap.city + " " + idMap.district); $("#districtId").val(idMap.aid); } } else if (areaId) { //地址修改页面 idMap = getIdMapByAreaId(areaId) || {}; } if (idMap.pindex) { cityPicker.pickers[0].setSelectedIndex(idMap.pindex); } //级联下拉框似乎有bug,需要延迟执行一次 setTimeout(function () { if (idMap.cindex) { cityPicker.pickers[1].setSelectedIndex(idMap.cindex); } setTimeout(function () { if (idMap.aindex) { cityPicker.pickers[2].setSelectedIndex(idMap.aindex); } }, 300) }, 333) } initUI(); setAddressData(); setAddressSelected(option); setAreaTypeData(); return { setAddressSelected: setAddressSelected } } /***根据第三级地址的id,找到地址的所有信息省、市、线**/ function getIdMapByAreaId(areaId) { var list1 = window.cityData3;//所有省 for (var index1 in list1) { var pid = list1[index1].value; var ptext = list1[index1].text; var list2 = list1[index1].children;//省下市 if (list2) { for (var index2 in list2) { var cid = list2[index2].value; var ctext = list2[index2].text; var list3 = list2[index2].children;//市下区或县 if (list3) { for (var index3 in list3) { var item = list3[index3]; var aid = item.value; var atext = item.text; if (aid == areaId) { return { province: ptext, city: ctext, district: atext, pindex: index1, cindex: index2, aindex: index3, pid: pid, cid: cid, aid: aid } } } } } } } } /***根据百度地图提供的地址信息找到地址数据的省、市、线*/ function getIdMapByDistrict(addressComponents) { var province = addressComponents.province; var city = addressComponents.city; var district = addressComponents.district; var list1 = window.cityData3;//所有省 for (var index1 in list1) { var pid = list1[index1].value; var ptext = list1[index1].text; var list2 = list1[index1].children;//省下市 if (province === ptext && list2) { for (var index2 in list2) { var cid = list2[index2].value; var ctext = list2[index2].text; var list3 = list2[index2].children;//市下区或县 if (city === ctext && list3) { for (var index3 in list3) { var item = list3[index3]; var aid = item.value; var atext = item.text; if (district === atext) { return { province: ptext, city: ctext, district: atext, pindex: parseInt(index1), cindex: parseInt(index2), aindex: parseInt(index3), pid: pid, cid: cid, aid: aid } } } break; } } break; } } uplog && uplog({level: "error", short_message: "异常:未找到地区信息", full_message: addressComponents}); }