原生js實現(xiàn)省市區(qū)三級聯(lián)動代碼分享
前言
插件功能只滿足我司業(yè)務(wù)需求,如果希望有更多功能的,可在下方留言,我盡量擴展!如果你有需要或者喜歡的話,可以給我github來個star
準(zhǔn)備
<div id="wrap"></div>
頁面中的容器標(biāo)簽不限制,只需給個id就行
var address = new Address({ wrapId: 'wrap', showArr: ['provinces','citys','areas'], beforeCreat:function(){ console.log("beforeCreat") }, afterCreat:function(){ console.log('afterCreat'); } })
wrapId:"wrap" // 此處的wrap就是上面容器的id showArr: ['provinces','citys','areas'] // 此處分別代表省、市、區(qū)容器的id
舉個例子:如果傳遞的數(shù)組['provinces','citys','areas']
長度為3,那么將會出現(xiàn)省市區(qū),數(shù)組中三個字符串分別是省、市、區(qū)容器的id
如傳遞的數(shù)組['provinces','citys']
長度為2個,那么將會出現(xiàn)省市,數(shù)組中的兩個字符串分別是省、市容器的id
如數(shù)組長度為1的時候就不說了
beforeCreat
插件開始創(chuàng)建前執(zhí)行的回調(diào)函數(shù)
afterCreat
插件創(chuàng)建完成后執(zhí)行的回調(diào)函數(shù)
預(yù)覽
總結(jié)
如有什么功能需要增加的,可在評論區(qū)留言,我盡量滿足。如有什么疏忽或錯誤,希望您指出。我會盡早修改,以免誤導(dǎo)他人。
- PHP+Mysql+Ajax+JS實現(xiàn)省市區(qū)三級聯(lián)動
- javascript實現(xiàn)省市區(qū)三級聯(lián)動下拉框菜單
- 省市區(qū)三級聯(lián)動下拉框菜單javascript版
- js實現(xiàn)一個省市區(qū)三級聯(lián)動選擇框代碼分享
- 從QQ網(wǎng)站中提取的純JS省市區(qū)三級聯(lián)動菜單
- JSON+Jquery省市區(qū)三級聯(lián)動
- vue.js模仿京東省市區(qū)三級聯(lián)動的選擇組件實例代碼
- javascript實現(xiàn)簡單的省市區(qū)三級聯(lián)動
- javascript省市區(qū)三級聯(lián)動下拉框菜單實例演示
- js實現(xiàn)省市區(qū)三級聯(lián)動非select下拉框版
相關(guān)文章
JavaScript之Getters和Setters 平臺支持等詳細介紹
現(xiàn)在,JavaScript的Getters和Setters使用非常廣泛,它和每個JavaScript開發(fā)者的切身利益息息相關(guān),我們先來快速了解什么是Getters和Setters,以及它們?yōu)槭裁春苡杏?然后,我們來看看現(xiàn)在都有哪些平臺支持Gettets和Setters2012-12-12js學(xué)習(xí)總結(jié)之dom2級事件基礎(chǔ)知識詳解
這篇文章主要為大家詳細介紹了js學(xué)習(xí)總結(jié)之dom2級事件基礎(chǔ)知識,具有一定的參考價值,感興趣的小伙伴們可以參考一下2017-07-07JavaScript數(shù)據(jù)結(jié)構(gòu)之雙向鏈表定義與使用方法示例
這篇文章主要介紹了JavaScript數(shù)據(jù)結(jié)構(gòu)之雙向鏈表定義與使用方法,簡單介紹了雙向鏈表的原理,并結(jié)合實例形式分析了雙向鏈表的定義與使用方法,需要的朋友可以參考下2017-10-10JavaScript實現(xiàn)圖片懶加載的三種常用方法總結(jié)
懶加載是一種對網(wǎng)頁性能優(yōu)化的方式,也是我們經(jīng)常會用到的技術(shù),這篇文章為大家整理了JavaScript實現(xiàn)圖片懶加載的三種常用方法,希望對大家有所幫助2023-06-06