JS實現級聯選單

2022-05-25 06:03:12 字數 1998 閱讀 7417

是首先應該新增兩個下拉列表並設定id屬性來方便操作:

1

<

select

id="country"

>

2<

option

>國家

option

>

3select

>

4<

select

id="city"

>

5<

option

>城市

option

>

6select

>

js**中首先需要宣告國家和城市兩個陣列:

var country = ['中國', '美國','英國']

var city = [

['北京', '上海'],

['紐約'],

['倫敦']

]

然後通過id獲取頁面中的下拉列表元素:

var cou = document.getelementbyid("country");

var cit = document.getelementbyid("city");

然後初始化第乙個列表:

//初始化國家下拉列表

for(var i = 0; i

<

country

.length; i++)

在第乙個下拉列表中選擇國家後,第二個列表顯示相應的城市:

//為國家下拉列表新增事件

cou.addeventlistener('change', function()

}});

doctype html

>

<

html

>

<

head

>

<

meta

charset

="utf-8"

>

<

title

>

title

>

head

>

<

body

>

<

select

id="country"

>

<

option

>國家

option

>

select

>

<

select

id="city"

>

<

option

>城市

option

>

select

>

<

script

>

varcountry =[

'中國',

'美國',

'英國']

varcity =[

['北京

', '上海

'],['紐約

'],['倫敦']]

varcou

=document.getelementbyid(

"country");

varcit

=document.getelementbyid(

"city");

//初始化國家下拉列表

for(

vari =0

; i

<

country.length; i

++)

//為國家下拉列表新增事件

cou.addeventlistener(

'change',

function

() }

});script

>

body

>

html

>

完整**

JS 讀取XML設定級聯選單

請選擇 河北省 遼寧省 山東省 請選擇 window.onload function var provincevalue this.value 用 provincevalue 去 xml 文件中獲取對應的 province 節點 var provincenodeinxmlfile xmldocume...

實現基於json的級聯選單

我曾經看到這樣乙個故事,說在有一座佛寺裡,那麼供著乙個花崗岩雕刻的非常精緻的佛像,每天有很多人到這裡的膜拜,但是通往這座佛像的台階是跟它採自同樣一塊山石的很多花崗岩,終於有一天,這些台階變的不服氣了,他們對那個佛像提出 說你看我們本是兄弟,我們來自同乙個山體,憑什麼人們都踩著我去膜拜你?你有什麼了不...

動態級聯選單

在專案中遇到最多的就是級聯選單的實現。省級 市級 縣級等等。如果將這些資料放到資料庫中,每一次訪問資料都要鏈結資料庫。目前專案中的做法是select的每一次change事件都要查詢一次。我覺得此次操作有些多餘。先不說這些資料從 得到,或者要不要放到快取中,或者這些資料是不易改變,還是時常改變。我自我...