<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> 二级联动菜单 </TITLE>
<script language="javascript">
var jiangxi=[["1","南昌"],["2","上饶"],["3","赣州"]];
var zhejiang=[["1","杭州"],["2","嘉兴"]];
var lalala=[["1","啦啦啦"]];
var temp = 10; /* temp 为要清除的个数,如不设可能会出现问题*/
function showCities(cityArray)
{
for(var m=temp;m>=0;m--)
{
//这个要看清楚,因为要重新填充下拉列表的话必须先清除里面原有的项,
//清除和增加当然是有区别的了,所以用递减
document.form1.cities.options[m]=null;//将该项设置为空,也就等于清除了
}
for(i=0;i<cityArray.length;i++)
{
document.form1.cities.options[i]=new Option(cityArray[i][1],cityArray[i][0]);
}
}
var temp;
function updateCities()
{
var selectedProvince=document.form1.province.value;
switch(selectedProvince){
/* case'x': 表示对 x 数组进行操作*/
case'1':showCities(jiangxi);break;
case'2':showCities(zhejiang);break;
case'3':showCities(lalala);break;
}
}
</script>
</HEAD>
<BODY>
<form name="form1" id="xx" method="post" action="">
<select name="province" onChange="javascript:updateCities()">
<option value="1">江西</option>
<option value="2" >浙江</option>
<option value="3" >啦啦啦</option>
</select>
<select name="cities">
<option value="1">南昌</option>
<option value="2">上饶</option>
<option value="3">赣州</option>
</select>
</form>
</BODY>
</HTML>
二级联动菜单--常见的城市二级联动
最新推荐文章于 2021-07-08 10:23:49 发布