JavaScript【省市级联】

CSS代码:
<script type="text/javascript">
 function changeShow(){
  var city= new Array;
  city["河北省"]=["--请选择城市--","邯郸市","石家庄","秦皇岛","武安市","邢台市","廊坊市","沧州市","合肥市"];
  city["hebei"]=["select","handan","shijiazhuang","qinhuangdao","wuan","xingtai","langfang","cangzhou","hefei"];
  city["山东省"]=["--请选择城市--","不知道"];
  city["shangdong"]=["select","buzhidao"];
  city["北京市"]=["--请选择城市--","海淀区","宣武区","朝阳区","东城区"];
  city["biejing"]=["select","haidian","xuanwu","chaoyang","dongcheng"];
  
  var cityvalue= document.getElementById("sheng").value;
  switch(cityvalue){
   case "河北省":
     document.getElementById("shi").options.length = 0;
    for(var i=0;i<city["河北省"].length;i++){
     document.getElementById("shi").options.add(new Option(city["河北省"][i], city["hebei"][i])); 
    }
   break;
   case "山东省":
     document.getElementById("shi").options.length = 0;
    for(var i=0;i<city["山东省"].length;i++){
     document.getElementById("shi").options.add(new Option(city["山东省"][i], city["shangdong"][i])); 
    }
   break;
   case "北京市":
     document.getElementById("shi").options.length = 0;
    for(var i=0;i<city["北京市"].length;i++){
     document.getElementById("shi").options.add(new Option(city["北京市"][i], city["biejing"][i]));
    }
   break;
  }
 }
</script>
HTML代码:
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>省市级联</title>
</head>
<body>
<select id="sheng" onchange="changeShow()">
<option value="" selected="selected">--请选择省份--</option>
<option value="河北省">河北省</option>
<option value="山东省">山东省</option>
<option value="北京市">北京市</option>
</select>
<select id="shi" >
<option value="" selected="selected">--请选择市区--</option>
</select>
</body>
</html>

你可能感兴趣的:(JavaScript【省市级联】)