開發(fā)工具-intellij IDEA

需求

1.實(shí)現(xiàn)對json文件的讀取。

2.可以在省級選擇所有省名和直轄市名

3.選擇一級省名后自動刷新市名

4.選擇二級市名后自動刷新區(qū)名

邏輯分析

第一步：讀取json文件

第二步：遍歷出所有一級的省名

第三步：把遍歷出來的省名動態(tài)追加到select標(biāo)簽下

第四步：給一級省名注冊change事件

第五步：點(diǎn)擊省名后獲取省的id值

第六步：確定點(diǎn)擊的對象數(shù)據(jù)

第七步：做判斷，如果直轄市的話下面就是直接顯示區(qū)名，如果不是就顯示市名

第八步：遍歷出這個(gè)對象的地區(qū)名數(shù)據(jù)

第九步：動態(tài)追加數(shù)據(jù)

第十步：重復(fù)上步驟，完成三級追加

具體實(shí)現(xiàn)

頁面準(zhǔn)備

html：

選擇所屬城市

省: 市: 區(qū):

css

json部分?jǐn)?shù)據(jù)

{ "label": "11

總結(jié)

以上是生活随笔為你收集整理的地区json文件_【小例子】使用jQuery实现省市区三级联动显示，附源码json文件的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。