JS+html实现select⼆级联动菜单
<html>
<head>
<title></title>
<script language="javascript" type="text/javascript">
//定义城市数据数组
cityArray = new Array();
cityArray[0] = new Array("河南省","郑州市|开封市|洛阳市|平顶⼭市|安阳市|鹤壁市|新乡市|焦作市|濮阳市|许昌市|漯河市|三门峡市|南阳市|商丘市|信阳市|周⼝市|驻马店cityArray[1] = new Array("云南省","昆明市|⼤理市|曲靖市|⽟溪市|昭通市|楚雄市|红河市|⽂⼭市|思茅市|西双版纳市|保⼭市|德宏市|丽江市|怒江市|迪庆市|临沧市"); cityArray[2] = new Array("其它","其它");
cityArray[3] = new Array("请选择","-请选择-");
function getCity(currProvince)
{
//当前所选择的省
var currProvince = currProvince;
var i,j,k;
//清空城市下拉选单
document.all.selCity.length = 0 ;
for (i = 0 ;i <cityArray.length;i++)
{
//得到当前省在城市数组中的位置
if(cityArray[i][0]==currProvince)
{
//得到当前省所辖制的地市
var tmpcityArray = cityArray[i][1].split("|")
for(j=0;j<tmpcityArray.length;j++)
{
//填充城市下拉选单
document.all.selCity.options[document.all.selCity.length] = new Option(tmpcityArray[j],tmpcityArray[j]);
}
}
}
}
</script>
</head>
<body>
<form id="form1">
<!-- 此处getCity()⽅法获取的是option标签中的value属性所对应的值,⽽不是页⾯显⽰的值 -->
<select id="selProvince" onChange = "getCity(this.options[this.selectedIndex].value)">
<option value="请选择">-请选择-</option>
<option value="河南省">河南省</option>html下拉菜单的制作方法
<option value="云南省">云南省</option>
<option value="其它">其它</option>
</select>
<select id="selCity">
<option>-请选择-</option>
</select>
</form>
</body>
</html>
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。
发表评论