案例 js二級聯動

2021-10-13 09:59:47 字數 1596 閱讀 8895

這是js常用功能,比如省份和城市的聯動

這是頁面標籤

action="

">

省份:"pre"

>

select

>

城市:"cy"

>

select

>

form

>

這是資料

var provinces =

["請選擇省份"

,"北京市"

,"天津市"

,"上海市"

,"重慶市"

,"江蘇省"

,"浙江省"

,"江西省"

,"海南省"];

var citys =[[

"請選擇城市"],

["北京市"],

["天津市"],

["上海市"],

["重慶市"],

["南京市"

,"無錫市"

,"徐州市"

,"常州市"

,"蘇州市"

,"南通市"

,"連雲港市"

,"淮安市"

,"鹽城市"

,"揚州市"

,"鎮江市"

,"泰州市"

,"宿遷市"],

["杭州市"

,"寧波市"

,"溫州市"

,"紹興市"

,"湖州市"

,"嘉興市"

,"金華市"

,"衢州市"

,"台州市"

,"麗水市"

,"舟山"],

["南昌市"

,"九江市"

,"上饒市"

,"撫州市"

,"宜春市"

,"吉安市"

,"贛州市"

,"景德鎮"

,"萍鄉市"

,"新余市"

,"鷹潭市"],

["海口市"

,"三亞市"

,"三沙市"

,"儋州市"]]

;

獲取元素

var pre = document.

getelementbyid

('pre'

)var cy = document.

getelementbyid

('cy'

)

渲染省份列表

for

(var i =

0; i < provinces.length; i++

)

給二級列表初始效果

var index =

0var option = document.

createelement

('option'

) option.innerhtml = citys[index]

cy.(option)

關鍵**

pre.

onchange

=function()

}

二級聯動 js

在html部分只寫兩個select標籤 option標籤將用js的方法寫入 onchange 內容發生改變事件 用於select下拉列表中後的內容發生改變時候的觸發 核心部分就是js裡面的內容 建立乙個物件data來儲存資料 data 首先通過for迴圈來新增第一級裡面的內容 province va...

JS控制二級聯動

在註冊頁面上有乙個下拉列表,下拉列表顯示省份資訊,有另乙個下列列表.選擇某個省份,將這個省份下的城市列出。陣列 步驟一 確定事件 onchange.步驟二 獲得改變的省份值 步驟三 比較省份的值 與 陣列中定義的值是否相等,如果相等獲得這個省份對應的所有的市的陣列.步驟四 建立option元素,將陣...

js 省市二級聯動

bootstrap jquery 省市二級聯動 html panel panel default panel body h2 id selectprovince province1 遼寧省 option province2 selected 吉林省 option province3 黑龍江省 opt...