小編給大家分享一下js如何實現(xiàn)城市級聯(lián)菜單,相信大部分人都還不怎么了解,因此分享這篇文章給大家參考一下,希望大家閱讀完這篇文章后大有收獲,下面讓我們一起去了解一下吧!
成都創(chuàng)新互聯(lián)專注為客戶提供全方位的互聯(lián)網(wǎng)綜合服務(wù),包含不限于網(wǎng)站設(shè)計、網(wǎng)站建設(shè)、君山網(wǎng)絡(luò)推廣、小程序制作、君山網(wǎng)絡(luò)營銷、君山企業(yè)策劃、君山品牌公關(guān)、搜索引擎seo、人物專訪、企業(yè)宣傳片、企業(yè)代運營等,從售前售中售后,我們都將竭誠為您服務(wù),您的肯定,是我們最大的嘉獎;成都創(chuàng)新互聯(lián)為所有大學(xué)生創(chuàng)業(yè)者提供君山建站搭建服務(wù),24小時服務(wù)熱線:18980820575,官方網(wǎng)址:sd-ha.com
JS是JavaScript的簡稱,它是一種直譯式的腳本語言,其解釋器被稱為JavaScript引擎,是瀏覽器的一部分,主要用于web的開發(fā),可以給網(wǎng)站添加各種各樣的動態(tài)效果,讓網(wǎng)頁更加美觀。
具體內(nèi)容如下
方法一:用switch方法判斷。
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script type="text/javascript"> function changeCity() { var x=['牛奶','豆?jié){','油條']; console.log(x.join(',')); var y=[33,22,66,12]; console.log(y.sort()); //如果選擇的是河南 在城市中: 洛陽 ,駐馬店 //如果選擇的是河北 在城市中: 石家莊 ,保定 var province = document.getElementById('selProvince'); var city = document.getElementById('selCity'); //在添加城市前,先清空上一次添加的城市 city.length = 1; switch (province.value) { case '河南省': var op1 = new Option('洛陽', '洛陽'); var op2 = new Option('駐馬店', '駐馬店'); city.add(op1, null); city.add(op2, null); break; case '河北省': var op1 = new Option('石家莊', '石家莊'); var op2 = new Option('保定', '保定'); city.add(op1, null); city.add(op2, null); break; } } </script> </head> <body> <form action="" name="myform"> <select id="selProvince" onchange="changeCity( )"> <option>--選擇省份--</option> <option value="河南省">河南省</option> <option value="河北省">河北省</option> </select> <select id="selCity"> <option>--選擇城市--</option> </select> </form> </body> </html>
方法二:用if進行判斷。
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script> function chagecity() { var citylist = []; citylist['四川省'] = ['成都市', '郫都區(qū)']; citylist['廣東省'] = ['深圳市', '東莞市']; var provinceV = document.getElementById("province").value; var city = document.getElementById("city"); city.length = 1; //清除當(dāng)前city中的選項 // for (var i in citylist){ // if (i == provinceV){ // for (var j in citylist[i]){ // citylist.add(new Option(citylist[i][j],citylist[i][j]),null); // } // } // } for (var i in citylist) { if (i == provinceV) {//判斷i是不是等于province中的值 for (var j in citylist[i]) {//遍歷citylist數(shù)組 var op = new Option(citylist[i][j], citylist[i][j]);//把定義好的數(shù)據(jù)添加到city中 city.add(op, null); } } } } </script> </head> <body> <form action=""> <select name="" id="province" onchange="chagecity()"> <option value="四川省">四川</option> <option value="廣東省">廣東</option> </select> <select id="city"> <option value="選擇城市">選擇城市</option> </select> </form> </body> </html>
以上是“js如何實現(xiàn)城市級聯(lián)菜單”這篇文章的所有內(nèi)容,感謝各位的閱讀!相信大家都有了一定的了解,希望分享的內(nèi)容對大家有所幫助,如果還想學(xué)習(xí)更多知識,歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道!
當(dāng)前文章:js如何實現(xiàn)城市級聯(lián)菜單
轉(zhuǎn)載源于:http://sd-ha.com/article6/joscig.html
成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供服務(wù)器托管、企業(yè)建站、App設(shè)計、定制開發(fā)、網(wǎng)站營銷、網(wǎng)站收錄
聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請盡快告知,我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時需注明來源: 創(chuàng)新互聯(lián)