下拉列表級聯的小demo
阿新 • • 發佈:2018-12-28
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> </head> <script type="text/javascript"> var shengArr = new Array(); shengArr["廣東"] = ["廣州", "深圳", "珠海", "汕頭", "韶關"]; shengArr["湖南"] = ["長沙", "張家界", "株洲", "懷化", "常德"]; shengArr["湖北"] = ["武漢", "荊州", "宜昌", "黃岡", "仙桃"]; shengArr["安徽"] = ["合肥", "黃山"]; shengArr["河南"] = ["鄭州", "信陽", "洛陽"]; function getSheng() { var s = document.getElementById("sheng"); for (var v in shengArr) { s.add(new Option(v, v), null); } } function getCity() { var s = document.getElementById("sheng"); var c = document.getElementById("city"); var v = s.value; c.options.length = 0; for (var i in shengArr[v]) { c.add(new Option(shengArr[v][i], shengArr[v][i]), null); } } </script> <!--頁面載入時獲取 省名--> <body onload="getSheng()"> <!-- 改變省時匹配該省的城市名--> 省: <select id="sheng" onchange="getCity()"> <option>--請選擇</option> </select> 市: <select id="city"></select> </body> </html>