<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();
}
</script>
</head>
<body>
请选择省份:
<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>
</body>
</html>
for部分也可修改以下:
for(i=0;i<cityLength;i++){ city.options[i].text=aCity[provincedId][i]; city.options[i].value=aCity[provincedId][i]; }