『壹』 請問用什麼方式可以實現省市級聯的效果呀 省市的數據是從資料庫中查出來的
使用jquery的ajax方式從伺服器載入json數據至客戶端即可以實現省市級聯的效果。
具體如下:
1)、頁面初始化時,首先載入所有的省;
2)、選擇省,ajax傳送編碼至伺服器,伺服器根據選中的省編碼,返回省下所有的市。
這樣就能動態實現了省市級聯的效果了。
『貳』 web前端怎麼引用jquery省市級聯插件
1.[代碼]新增選擇城市
$(function(){
$("#province").cityCasCade("#city").cityCasCade('select','河南省');
//or
$("#province").cityCasCade("#city").cityCasCade('select','河南省','開封市');
}
/**
*javadiqye
*城市數據時從網上Copy的
*級聯功能也是參考網上已做好的思路
*封裝成插件為了以後使用方便
*add增加選中城市方法select
*/
(function($){
$.fn.cityCasCade=function(operation,province,city){
varselectCity=null,params=null,overparams=null;
if(typeofoperation=="string"){
if(operation=="select"){
if(province){
$(this).find("option").each(function(){
if($(this).val()==province){
this.selected=true;
$(this).change();
if(city){
$($.fn.cityCascadeParam.selectCity).find("option").each(function(){
if($(this).val()==city){
this.selected=true;
$(this).change();
}
});
}
}
});
}
return$(this);
}
selectCity=operation;
}
else{
if(operation.selector)selectCity=operation.selector;
if(operation.overide&&operation.data)overparams=operation.data;
elseparams=operation.data;
}
$.fn.cityCascadeParam={};
$.fn.cityCascadeParam.data=_provinces_;
$.fn.cityCascadeParam.selectCity=null;
if(selectCity)$.fn.cityCascadeParam.selectCity=selectCity;
elsethrow"城市選擇器不能為空";
$.fn.cityCascadeParam.cityValue=$($.fn.cityCascadeParam.selectCity+":first").val();
$.fn.cityCascadeParam.cityText=$($.fn.cityCascadeParam.selectCity+":first").text();
if(overparams)$.fn.cityCascadeParam.data=overparams;
else$.extend($.fn.cityCascadeParam.data,params);
$.fn.cityCascadeParam.loadProvince=function(self){
for(varpin$.fn.cityCascadeParam.data){
varopt=document.createElement("option");
opt.innerHTML=p;
opt.value=p;
self.appendChild(opt);
}
}
$.fn.cityCascadeParam.loadCity=function(parent){
varself=$($.fn.cityCascadeParam.selectCity).get(0);
if(!self)throw"未找到城市下拉框城市選擇器>>"+$.fn.cityCascadeParam.selectCity;
varselectProvince=$(parent).val();
if(selectProvincein$.fn.cityCascadeParam.data){
varcitys=$.fn.cityCascadeParam.data[selectProvince];
self.innerHTML="";
for(varindex=0;index<citys.length;index++){
opt=document.createElement("option");
opt.innerHTML=citys[index];
opt.value=citys[index];
self.appendChild(opt);
}
}else{
self.innerHTML="";
opt=document.createElement("option");
opt.innerHTML=$.fn.cityCascadeParam.cityText;
opt.value=$.fn.cityCascadeParam.cityValue;
self.appendChild(opt);
}
}
this.each(function(){
$.fn.cityCascadeParam.loadProvince(this);
$(this).change(function(){
$.fn.cityCascadeParam.loadCity(this);
});
});
return$(this);
}
})($);
var_provinces_={四川省:["成都市","自貢市","攀枝花市","瀘州市","德陽市","綿陽市","廣元市","遂寧市","內江市","樂山市","南充市","眉山市","宜賓市","廣安市","達州市","雅安市","巴中市","資陽市","阿壩藏族羌族自治州","甘孜藏族自治州","涼山彝族自治州"],山西省:["太原市","大同市","陽泉市","長治市","晉城市","朔州市","晉中市","運城市","忻州市","臨汾市","呂梁市"],內蒙古:["呼和浩特市","包頭市","烏海市","赤峰市","通遼市","鄂爾多斯市","呼倫貝爾市","巴彥淖爾市","烏蘭察布市","興安盟","錫林郭勒盟","阿拉善盟"],遼寧省:["沈陽市","大連市","鞍山市","撫順市","本溪市","丹東市","錦州市","營口市","阜新市","遼陽市","盤錦市","鐵嶺市","朝陽市","葫蘆島市"],吉林省:["長春市","吉林市","四平市","遼源市","通化市","白山市","松原市","白城市","延邊朝鮮族自治州"],黑龍江省:["哈爾濱市","齊齊哈爾市","雞西市","鶴崗市","雙鴨山市","大慶市","伊春市","佳木斯市","七台河市","牡丹江市","黑河市","綏化市","大興安嶺地區"],上海:["上海"],江蘇省:["南京市","無錫市","徐州市","常州市","蘇州市","南通市","連雲港市","淮安市","鹽城市","揚州市","鎮江市","泰州市","宿遷市"],浙江省:["杭州市","寧波市","溫州市","嘉興市","湖州市","紹興市","金華市","衢州市","舟山市","台州市","麗水市"],安徽省:["合肥市","蕪湖市","蚌埠市","淮南市","馬鞍山市","淮北市","銅陵市","安慶市","黃山市","滁州市","阜陽市","宿州市","巢湖市","六安市","亳州市","池州市","宣城市"],福建省:["福州市","廈門市","莆田市","三明市","泉州市","漳州市","南平市","龍岩市","寧德市"],江西省:["南昌市","景德鎮市","萍鄉市","九江市","新余市","鷹潭市","贛州市","吉安市","宜春市","撫州市","上饒市"],山東省:["濟南市","青島市","淄博市","棗庄市","東營市","煙台市","濰坊市","濟寧市","泰安市","威海市","日照市","萊蕪市","臨沂市","德州市","聊城市","濱州市","菏澤市"],河南省:["鄭州市","開封市","洛陽市","平頂山市","安陽市","鶴壁市","新鄉市","焦作市","濮陽市","許昌市","漯河市","三門峽市","南陽市","商丘市","信陽市","周口市","駐馬店市"],湖北省:["武漢市","黃石市","十堰市","宜昌市","襄樊市","鄂州市","荊門市","孝感市","荊州市","黃岡市","咸寧市","隨州市","恩施土家族苗族自治州"],湖南省:["長沙市","株洲市","湘潭市","衡陽市","邵陽市","岳陽市","常德市","張家界市","益陽市","郴州市","永州市","懷化市","婁底市","湘西土家族苗族自治州"],廣東省:["廣州市","韶關市","深圳市","珠海市","汕頭市","佛山市","江門市","湛江市","茂名市","肇慶市","惠州市","梅州市","汕尾市","河源市","陽江市","清遠市","東莞市","中山市","潮州市","揭陽市","雲浮市"],廣西省:["南寧市","柳州市","桂林市","梧州市","北海市","防城港市","欽州市","貴港市","玉林市","百色市","賀州市","河池市","來賓市","崇左市"],海南省:["海口市","三亞市"],重慶市:["重慶"],貴州省:["貴陽市","六盤水市","遵義市","安順市","銅仁地區","黔西南布依族苗族自治州","畢節地區","黔東南苗族侗族自治州","黔南布依族苗族自治州"],雲南省:["昆明市","曲靖市","玉溪市","保山市","昭通市","麗江市","思茅市","臨滄市","楚雄彝族自治州","紅河哈尼族彝族自治州","文山壯族苗族自治州","西雙版納傣族自治州","大理白族自治州","德宏傣族景頗族自治州","怒江傈僳族自治州","迪慶藏族自治州"],西藏自治區:["拉薩市","昌都地區","山南地區","日喀則地區","那曲地區","阿里地區","林芝地區"],陝西省:["西安市","銅川市","寶雞市","咸陽市","渭南市","延安市","漢中市","榆林市","安康市","商洛市"],甘肅省:["蘭州市","嘉峪關市","金昌市","白銀市","天水市","武威市","張掖市","平涼市","酒泉市","慶陽市","定西市","隴南市","臨夏回族自治州","甘南藏族自治州"],青海省:["西寧市","海東地區","海北藏族自治州","黃南藏族自治州","海南藏族自治州","果洛藏族自治州","玉樹藏族自治州","海西蒙古族藏族自治州"],寧夏自治區:["銀川市","石嘴山市","吳忠市","固原市","中衛市"],新疆自治區:["烏魯木齊市","克拉瑪依市","吐魯番地區","哈密地區","昌吉回族自治州","博爾塔拉蒙古自治州","巴音郭楞蒙古自治州","阿克蘇地區","克孜勒蘇柯爾克孜自治州","喀什地區","和田地區","伊犁哈薩克自治州","塔城地區","阿勒泰地區"],台灣省:["台北市"],香港特區:["香港"],澳門特區:["澳門"],河北省:["石家莊","唐山","秦皇島","張家口","承德","廊坊","邯鄲","邢台","保定","滄州","衡水"]};
『叄』 有沒有前端大佬寫過一種方法,根據任意地址拿到該地址所對應的省市區的方法
貨拉拉上面輸入地址。
『肆』 想做一個android 省市縣三級聯動,數據是從介面讀取,怎麼做
以前做過,數據是在本地xml裡面取的: 上面是省市區的xml數據網盤地址。 如果要做成從伺服器取,那麼就一次性取下來,然後還是一樣的流程。 如果你想選擇省再去取對應的市,那麼就要傳省的id去獲取對應的市,這時候就要有等待框,可能用戶體驗差一點。
『伍』 Django接受前端數據的幾種方法
字元型
字元型的數據相對好獲取,前端傳遞的方法如下:
sendData = {
"exporttype": exporttype,
"bugids": bugids,
"test": JSON.stringify({"test": "test"})
};
在Django的後端只要使用exporttype = request.GET.get("exporttype")
就能正常的獲取到這個數據了。
注意: 在Python2.7中數據是unicode編碼的,如果要使用,有時候需要進行轉str
結果示例:
Excle <type 'unicode'>
數組型
獲取數組型的數據如果使用獲取字元串的數據的方法,打出的結果是None。我們要使用這個方法:
bugids = request.GET.getlist("bugids[]")
這樣獲取的數據就是數組類型。
注意: 獲取的數組中的元素是unicode編碼的,在某些時候使用需要轉編碼
結果示例:
•傳遞的url
[14/Jul/2016 11:00:41]"GET /testtools/exportbug/?exporttype=Excle&bugids%5B%5D=102&bugids%5B%5D=101&bugids%5B%5D
•獲取的數據
[u'102', u'101', u'100', u'99', u'98', u'97', u'96', u'95', u'94', u'93', u'92', u'91', u'90', u'89', u'88', u'87'
字典型
字典型數據其實可以當成字元串數據來處理,獲取到對應字元串後使用JSON模塊做一下格式化就行了。
對於前端來說,傳遞字典型的數據就是傳遞JSON數據,所以使用的方法是:
"test": JSON.stringify({"test": "test"})
結果示例:
{"test":"test"} <type 'unicode'>
相關源碼
•Get方法
Get方法是wsgi裡面的一個方法。
def GET(self):
# The WSGI spec says 'QUERY_STRING' may be absent.
raw_query_string = get_bytes_from_wsgi(self.environ, 'QUERY_STRING', '')
return http.QueryDict(raw_query_string, encoding=self._encoding)
最終返回的是一個http.QueryDict(raw_query_string, encoding=self._encoding)http的原始數據,而QueryDict繼承於MultiValueDict ,所以我們直接看MultiValueDict就好了。
•MultiValueDict
其實源碼看起來並不難。
def get(self, key, default=None):
"""
Returns the last data value for the passed key. If key doesn't exist
or value is an empty list, then default is returned.
"""
try:
val = self[key]
except KeyError:
return default
if val == []:
return default
return val
def getlist(self, key, default=None):
"""
Returns the list of values for the passed key. If key doesn't exist,
then a default value is returned.
"""
try:
return super(MultiValueDict, self).__getitem__(key)
except KeyError:
if default is None:
return []
return default
def __getitem__(self, key):
"""
Returns the last data value for this key, or [] if it's an empty list;
raises KeyError if not found.
"""
try:
list_ = super(MultiValueDict, self).__getitem__(key)
except KeyError:
raise MultiValueDictKeyError(repr(key))
try:
return list_[-1]
except IndexError:
return []
『陸』 安卓開發中的全國各個省市縣數據如何獲取並且關聯上
聯動可以用事件監聽,當上級數據發生改變時,獲取當前值,然後根據當前值得到下級數據集
pengx6107發表於
2013-6-6
09:39:10
我不知道你的應用是什麼,我是這么做的,在本地用sqlite建了一個跟網上省市縣相同的表,建一個同步程序,將網上的省市縣數據下載到本地,這樣你就可以在本地分別建立省的ArrayList、以省為參數的市ArrayList、以市為參數的縣的ArrayList,這樣在省spinner載入省的數據源,在省得spinner事件中載入市的數據源,同理,在市的spinner事件中載入縣的數據,分別在省市縣的spinner事件取得值,希望對你有幫助
『柒』 省市縣三級聯動菜單,JS全國省市縣(區)聯動,怎樣連接到資料庫啊
給你一些思路:
1、省市縣的數據寫到資料庫中。每條數據會有一個父ID(上級ID)。
2、在頁面上省變動後,查詢市的數據以省的ID作為條件,縣也一樣,以市 的ID為條件。
第二種方法,
由於全國的這些基本上是固定的,一般變動比較少,這可以把這個數據寫到JS裡面,通過JS來實現。這個載入會快一些。這些數據可以到國家統計局的網站去下載。
『捌』 Vant Cascader 省市縣三級聯動
1、引用
2、添加
3、關聯data
data () {
return {
cascaderValue: "",//選擇的數據
addressDataArr:[],//保存省市縣數據
show:false,
provinceIndex:-1,//選擇省的次序
cityIndex:-1,//選擇城市的次序
}
}
4、請求省數據
this.getAddress("")
因為組件使用text和value展示,所以獲取的介面數據需要手動再存一下,element.name是名稱,element.code是城市編碼
重新選擇省或市要重置之前選擇的次序,確保在網路請求時數據能放入正確位置
onFinish後,選擇項的value會存在v-model的cascaderValue中,這里我存的是區縣的編碼,可以直接傳給後台
調試過程曾出現過放入childern數據後,組件刷新,數據不展示或一閃而過的情況,差點就砸電腦了,網路一圈不知道什麼情況,一般這種情況多半是粗心落下什麼東西了。。。仔細檢查一遍發現是因為忘了寫 v-model。。。。v-model很重要,一定要寫
『玖』 citypicker用法
方法
導入js文件
[html]view plain
<scriptsrc="/jquery.js"></script><!--jQueryisrequired-->
<scriptsrc="/city-picker.data.js"></script>
<scriptsrc="/city-picker.js"></script>
[html]view plain
<divdata-toggle="city-picker">
<inputreadonlytype="text"data-toggle="city-picker">
</div>
原理是通過js調取city-picker.data.js裡面的json數據。然後展示輸入,json格式如圖
[javascript]view plain
<spanstyle="white-space:pre"></span>86:{
'A-G':[
{code:'340000',address:'安徽省'},
{code:'110000',address:'北京市'},
{code:'500000',address:'重慶市'},
{code:'350000',address:'福建省'},
{code:'620000',address:'甘肅省'},
{code:'440000',address:'廣東省'},
{code:'450000',address:'廣西壯族自治區'},
{code:'520000',address:'貴州省'}],
'H-K':[
{code:'460000',address:'海南省'},
{code:'130000',address:'河北省'},
{code:'230000',address:'黑龍江省'},
{code:'410000',address:'河南省'},
{code:'420000',address:'湖北省'},
{code:'430000',address:'湖南省'},
{code:'320000',address:'江蘇省'},
{code:'360000',address:'江西省'},
{code:'220000',address:'吉林省'}],
'L-S':[
{code:'210000',address:'遼寧省'},
{code:'150000',address:'內蒙古自治區'},
{code:'640000',address:'寧夏回族自治區'},
{code:'630000',address:'青海省'},
{code:'370000',address:'山東省'},
{code:'310000',address:'上海市'},
{code:'140000',address:'山西省'},
{code:'610000',address:'陝西省'},
{code:'510000',address:'四川省'}],
'T-Z':[
{code:'120000',address:'天津市'},
{code:'650000',address:'新疆維吾爾自治區'},
{code:'540000',address:'西藏自治區'},
{code:'530000',address:'雲南省'},
{code:'330000',address:'浙江省'}]
},
110000:{
110100:'北京市',
},
110100:{
110101:'東城區',
110102:'西城區',
110105:'朝陽區',
110106:'豐台區',
110107:'石景山區',
110108:'海淀區',
110109:'門頭溝區',
110111:'房山區',
110112:'通州區',
110113:'順義區',
110114:'昌平區',
110115:'大興區',
110116:'懷柔區',
110117:'平谷區',
110228:'密雲縣',
110229:'延慶縣'
},
120000:{
120100:'天津市'
},
120100:{
120101:'和平區',
120102:'河東區',
120103:'河西區',
120104:'南開區',
120105:'河北區',
120106:'紅橋區',
120110:'東麗區',
120111:'西青區',
120112:'津南區',
120113:'北辰區',
120114:'武清區',
120115:'寶坻區',
120116:'濱海新區',
120221:'寧河縣',
120223:'靜海縣',
120225:'薊縣'
},
130000:{
130100:'石家莊市',
130200:'唐山市',
130300:'秦皇島市',
130400:'邯鄲市',
130500:'邢台市',
130600:'保定市',
130700:'張家口市',
130800:'承德市',
130900:'滄州市',
131000:'廊坊市',
131100:'衡水市'
},
86:{}裡面第一層是選擇第二層是省份代碼
跟86同層的都是省市的樹形結構和市區的樹形結構。
這樣我們可以從資料庫中找出我們需要顯示的省市區數據給city-picker
先附上代碼:
[java]view plain
<spanstyle="white-space:pre"></span>//增加省份
PageDatatempPd=newPageData();
List<PageData>provinces=ordersService.listAllProvince(pd);//獲取所有的省份
tempPd.put("中國",provinces);
data.put("86",tempPd);
//增加城市
List<PageData>citys=ordersService.listAllCity(pd);//獲取所有的城市和省份
Map<String,Object>provinceMap=newHashMap<>();
for(PageDataindex:citys){
if(provinceMap.get(index.getString("province_Code"))==null){
Map<String,Object>cityMap=newHashMap<>();
cityMap.put(index.getString("city_Code"),index.getString("city_Name"));
provinceMap.put(index.getString("province_Code"),cityMap);
}else{
((HashMap<String,Object>)provinceMap.get(index.getString("province_Code")))
.put(index.getString("city_Code"),index.getString("city_Name"));
}
}
data.putAll(provinceMap);
//增加中心
List<PageData>centers=centerService.listAll(pd);//獲取所有中心
Map<String,Object>centerMap=newHashMap<>();
for(PageDataindex:centers){
if(index.get("center_City")==null){
continue;
}
if(centerMap.get(index.getString("center_City"))==null){
Map<String,Object>center=newHashMap<>();
center.put(String.valueOf(index.get("CENTER_ID")),index.getString("CENTER_MC"));
centerMap.put(index.getString("center_City"),center);
}else{
((HashMap<String,Object>)centerMap.get(index.get("center_City"))).put(String.valueOf(index.get("CENTER_ID")),index.getString("CENTER_MC"));
}
}
data.putAll(centerMap);
這裡面的PageData是繼承的hashMap。獲取所有城市的時候連表查詢,查處城市所在省,欄位分別是province_Code,province_Name,city_Code,city_Name;
查找中心(也就是區)的時候查找中心所在城市,欄位分別是city_Code,city_Name,center_Name,center_Code.
把查出來的數據封裝成city-picker.data.js一樣格式數據後,轉成json輸出到前端,然後前端用給出的json數據顯示city-pick就能自定義省市區三級聯動了