?? select.html
字號:
<html>
<head>
<script language="javascript">
var arrBeijing = ["崇文","海淀","宣武","昌平","朝陽"];
var arrShanghai = ["虹橋","徐匯","浦東","黃浦江","城隍廟"];
var arrHebei = ["石家莊", "廊坊", "保定", "滄州", "邯鄲","張家口","承德"];
function getArr(proValue){
if(proValue == "beijing"){
return arrBeijing;
}else if(proValue == "shanghai"){
return arrShanghai;
}else if(proValue == "hebei"){
return arrHebei;
}
}
function changeCity(){
var selP = document.getElementById("selP");
//options --> 返回select對象中所有的option對象
var opts = selP.options;
//selectedIndex --> 返回當前選中option的下標
var optIndex = opts.selectedIndex;
var opt = opts[optIndex];
var optValue = opt.value;
//獲得城市列表
var arr = getArr(optValue);
//清空城市列表
var selC = document.getElementById("selC");
selC.length = 0;
//添加城市列表
for(var i=0; i<arr.length; i++){
//擴充城市列表長度
selC.length += 1;
//添加一個option
var newOp = new Option(arr[i],arr[i]);
selC.options[i] = newOp;
}
}
</script>
</head>
<body>
省份:
<select id="selP" onchange="changeCity()">
<option value="beijing">北京</option>
<option value="shanghai">上海</option>
<option value="hebei">河北</option>
</select>
城市(區):
<select id="selC">
<option>請選擇</option>
</select>
</body>
</html>?? 快捷鍵說明
復制代碼
Ctrl + C
搜索代碼
Ctrl + F
全屏模式
F11
切換主題
Ctrl + Shift + D
顯示快捷鍵
?
增大字號
Ctrl + =
減小字號
Ctrl + -