分割位址資訊回顯到相應的表單標籤

2021-08-22 03:17:25 字數 3232 閱讀 5411

我要處理的問題是,從請求中獲取到的obj.data.address資料依次回顯到三個分別代表省、市、區 的select標籤中。但是我obj.data.address只有類似這樣的資料 (「廣東省珠海市香洲區xx街道xx號」),我要怎麼根據這個位址資料來修改這三個select的顯示的呢?

思路:使用用字串的startswith方法

eg:'廣東省珠海市香洲區xx街道xx號'.startswith('廣東省')返回true,省份select的值被確定,然後將「廣東省」從位址中刪除掉address.replace('廣東省', '').

'珠海市香洲區xx街道xx號'.startswith('珠海市')返回true,市區select的值被確定,同樣在address中刪掉已匹配到的結果.

'香洲區xx街道xx號'.startswith('香洲區')返回true,市區select的值被確定,同樣在address中刪掉已匹配到的結果.

現在address中只剩下***街道***號,自然就是街道資訊了,將它放在表示街道的表單域中.

// address

let address = obj.data.address;

/* -- 省份 -- */

var provicenodelist = document.

queryselectorall

('#province option'

)let province = array.

from

(provicenodelist)

.filter

(ele =>)[

0];$

('#province').

val(province =

(province==undefined ?

'': province.value)).

change()

;address = address.

replace

(province,'')

; + '替換後', address)

/* -- 市區 -- */

var citynodelist = document.

queryselectorall

('#city option'

)let city = array.

from

(citynodelist)

.filter

(ele =>)[

0];$

('#city').

val(city =

(city==undefined ?

'': city.value)).

change()

;address = address.

replace

(city,'')

; + '替換後', address)

/* -- 縣區 -- */

var countynodelist = document.

queryselectorall

('#county option'

)let county = array.

from

(countynodelist)

.filter

(ele =>)[

0];$

('#county').

val(county =

(county==undefined ?

'': county.value)).

change()

;address = address.

replace

(county,'')

; + '替換後', address)

/* 街道 */$(

'#street').

val(address)

上面的方式確實是能解決問題。雖然看起來清晰,處理(省、市、區)的**在哪一塊很分明,但看起來**上是有一些囉嗦了,而且滑鼠上下滾動,這手也是挺累的哈。所以用下面這個版本避免**重複的問題。測試之後功能沒丟,心裡極舒服。

但是萬一後面出現問題,覺得要除錯這段**也是麻煩呢…

// address

let address = obj.data.address;

['province'

,'city'

,'county'].

map(el =>)[

0];$

('#'

+ el)

.val

(option =

(option==undefined ?

'': option.value)).

change()

; address = address.

replace

(option,'')

;})// 街道$(

'#street').

val(address)

20180925 更新一版在layui中的寫法,不同之處是 觸發下拉框變化的方式

[

'province'

,'city'

,'county'].

map(el =>)[

0];$

('#'

+ el)

.parent()

.find

("dd").

filter

((index, dd)

=> dd.innerhtml === option.innerhtml)[0

].click()

address = address.

replace

(option.innerhtml +

' ','');})

最後,8月份.您好!兵哥哥們辛苦了,因為你們,祖國才越來越強大。

資訊回顯到下拉框

背景 二級下拉框資訊在初始化時通過ajax載入 需求 將以儲存好的資訊回顯,下拉框選中已選資訊 盲點 在初始化進行選中 firstanalysis val 這時ajax非同步載入可能會出現val賦值發生在ajax之前,選擇資訊被覆蓋。失敗。效果 效果 評價 使用時不理想,被吐槽!解決方案2 在aja...

elementUI 位址回顯 預設位址

引入elementui地區元件 element china area data npm install element china area data sprovinceandcitydata是省市二級聯動資料 不帶 全部 選項 regiondata是省市區 聯動資料 不帶 全部 選項 provin...

jsp中radio的性別資訊的資料回顯

第一種方式 if test radio name emp.checked checked value 1 男 radio name emp.value 0 女 if if test radio name emp.value 1 男 radio name emp.checked checked val...