<select id="provice"><option value="-1">請選擇</option></select><select id="city"></select><select id="country"></select><script>//創建數組保存各個省份城市地區//省份：一維數組var proviceArr=['江西','福建','浙江'];//城市：二維數組var cityArr=[['上饒市','南昌市','萍鄉市'],['福州市','廈門市','三明市'],['杭州市','溫州市','紹興市']];//地區：三維數組var countryArr=[[['廣豐縣','玉山縣','上饒縣'],['東湖區','西湖區','青云譜區'],['安源區','湘東區','上栗縣']],[['鼓樓區','晉安區','馬尾區'],['湖里區','海滄區','集美區'],['三元區','梅列區','永安市']],[['上城區','下城區','江干區'],['鹿城區','龍灣區','甌海區'],['越城區','柯橋區','上虞區']]];function createOption(obj,data){for(var i in data){var op=new Option(data[i],i);console.log(op);obj.options.add(op);console.log(obj.options);}}var provice=document.getElementById('provice');createOption(provice,proviceArr);var city=document.getElementById('city');provice.onchange=function(){city.options.length=0;createOption(city,cityArr[provice.value]);if(provice.value>=0){city.onchange();}else{country.options.length=0;}}var country=document.getElementById('country');city.onchange=function(){country.options.length=0;createOption(country,countryArr[provice.value][city.value]);}</script>

總結

以上是生活随笔為你收集整理的JavaScript的三级联动的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。