JS 下拉菜单联动

浏览数：40 / 时间：2015年06月09日

示例代码：

<!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="1">重庆市</option>
           <option value="2">上海市</option>
           <option value="3">北京市</option>
       </select>
       地市：
       <select id="slt2">
           <option value="">请选择地市</option>
       </select>
    </form>
</body>
</html>
效果图：