省市级联操作实现-优快云博客

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>省市级联操作</title>
<script type="text/javascript">
   var provinces = new Array(
       new Array("00","--选择省份--"),
       new Array("01","北京市"),
       new Array("02","湖北省"),
       new Array("03","河南省"),
       new Array("04","河北省"),
       new Array("05","江苏省")
   );
   var citys = new Array(
       new Array("0101","北京市"),
       new Array("0102","通州"),
       new Array("0103","五环"),
       new Array("0201","武汉"),
       new Array("0202","武汉"),
       new Array("0203","武汉"),
       new Array("0301","郑州"),
       new Array("0302","郑州"),
       new Array("0303","郑州"),
       new Array("0401","石家庄"),
       new Array("0402","石家庄"),
       new Array("0403","石家庄"),
       new Array("0501","南京"),
       new Array("0502","苏州"),
       new Array("0503","常州")
   );
   function fillprovince(){
       var province = document.getElementById("province");
       for(var i = 0;i<provinces.length;i++){
           var option = new Option(provinces[i][1],provinces[i][0]);
           province.add(option);
       }
   }
   function changeCity(){
       var province = document.getElementById("province");
       var procode = province.options[province.selectedIndex].value;
       var city = document.getElementById("city");
       city.options.length = 0;
       for(var i = 0;i<citys.length;i++){
           if(citys[i][0].substring(0,2)==procode){
               city.options.add(new Option(citys[i][1],citys[i][0]));
           }
       }
   }
</script>
</head>
<body>
<select id="province" οnchange="changeCity()">
<script type="text/javascript">fillprovince();</script>
</select>
<select id="city" style="width: 100px"></select>
</body>
</html>