首页 > 代码库 > JS 下拉菜单联动
JS 下拉菜单联动
示例代码:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>select联动</title>
<script language="javascript">
function selct(arr){
var toList = document.form1.elements["slt2"];
var toLen = toList.options.length;
//清空列表
if(toLen>=0){
toList.options.length =0;
toLen=0;
}
for(var i=0;i<arr.length;i++){
var opn = new Option(arr[i],i);
toList.options[toLen] =opn;
toLen++;
}
}
function updateSelect(str){
switch(str){
case "1":selct(new Array("朝天门","解放碑","沙坪坝","观音桥","南坪","高新区"));break;
case "2":selct(new Array("上海市1","上海市2","上海市3","上海市4","上海市5"));break;
case "3":selct(new Array("南温泉","北温泉","西温泉","东温泉","北京市"));break;
}}
</script>
</head>
<body>
<form name="form1" method="POST">
请选择省份:
<select id="slt1" onChange="updateSelect(this.value)">
<option value="">请选择地市</option>
<option value="http://www.mamicode.com/1">重庆市</option>
<option value="http://www.mamicode.com/2">上海市</option>
<option value="http://www.mamicode.com/3">北京市</option>
</select>
地市:
<select id="slt2">
<option value="">请选择地市</option>
</select>
</form>
</body>
</html>
效果图:
本文出自 “老牛Java” 博客,请务必保留此出处http://liuyj.blog.51cto.com/2340749/1589504
JS 下拉菜单联动