<html >
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>二級聯動菜單</title>
<script language="javascript">
function changeCity(){
var aCity=new Array();
aCity[0]=new Array("---請選擇城市---");
aCity[1]=new Array("北京");
aCity[2]=new Array("廣州","深圳","珠海","廈門");
aCity[3]=new Array("長沙","株洲","衡陽","岳陽","張家界","永州");
var province=document.getElementById("province");
var provincedId=province.selectedIndex; //獲得當前選擇省份的索引
var cityLength=aCity[provincedId].length;//獲得當前選擇省份的城市個數
var city=document.getElementById("city");
city.options.length=cityLength; //設置城市列表框的選擇長度爲當前選擇省份的城市個數
for(i=0;i<cityLength;i++){
optonValue=aCity[provincedId][i];
city.options[i]=new Option(optonValue,optonValue); //用構造函數Option來創建一個新的option對象
}
city.focus();
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>二級聯動菜單</title>
<script language="javascript">
function changeCity(){
var aCity=new Array();
aCity[0]=new Array("---請選擇城市---");
aCity[1]=new Array("北京");
aCity[2]=new Array("廣州","深圳","珠海","廈門");
aCity[3]=new Array("長沙","株洲","衡陽","岳陽","張家界","永州");
var province=document.getElementById("province");
var provincedId=province.selectedIndex; //獲得當前選擇省份的索引
var cityLength=aCity[provincedId].length;//獲得當前選擇省份的城市個數
var city=document.getElementById("city");
city.options.length=cityLength; //設置城市列表框的選擇長度爲當前選擇省份的城市個數
for(i=0;i<cityLength;i++){
optonValue=aCity[provincedId][i];
city.options[i]=new Option(optonValue,optonValue); //用構造函數Option來創建一個新的option對象
}
city.focus();
}
</script>
</head>
<body>
請選擇省份:
<select id="province" onchange="changeCity()">
<option>---請選擇省份---</option>
<option value="北京">北京</option>
<option value="廣東">廣東</option>
<option value="湖南">湖南</option>
</select>
<br />
<br />
請選擇省份:
<select id="province" onchange="changeCity()">
<option>---請選擇省份---</option>
<option value="北京">北京</option>
<option value="廣東">廣東</option>
<option value="湖南">湖南</option>
</select>
<br />
<br />
請選擇城市:
<select id="city">
<option>---請選擇城市---</option>
</select>
<select id="city">
<option>---請選擇城市---</option>
</select>
</body>
</html>
</html>
for部分也可修改如下:
for(i=0;i<cityLength;i++){
city.options[i].text=aCity[provincedId][i];
city.options[i].value=aCity[provincedId][i];
}
city.options[i].text=aCity[provincedId][i];
city.options[i].value=aCity[provincedId][i];
}