github上克隆開源的三級地址選擇器,修改為四級地址選擇器。效果圖:

頁面引入四個文件
juery.js
city-picker.data.js (全國省市區數據)
city-picker.js (js實現功能邏輯)
city-picker.css (選擇器樣式,可優化樣式)
html頁面代碼
<div style="position: relative;"><input class="form-control" readonly type="text" data-toggle="city-picker" style="width:50%;"></div>
缺點及優化建議
1.選擇器是一次性加載全國省市區縣數據到客戶端,比較消耗性能流量(1M);
2.建議地址選擇,進行異步處理,比如點擊廣東省,只返回廣東的所有城市數據。
項目github地址和demo地址:
請關注公眾號,進入公眾號,然后搜索 “地址” 關鍵字,查看文章底部,謝謝!

