实现省份查询 功能

<!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>带下拉列表的输入框 - 分享JavaScript-sharejs.com</title>
</head>
<body>  
  <script>
  function on_click()
  {
  switch(document.form.province.value){
   case "请选择省份":
   var city=new Array("请选择市区");
   break;
   case "山东":
   var city=new Array("德州","济南","菏泽","聊城");
   break;
   case "北京":
   var city=new Array("顺义","东城","崇文区","朝阳区","丰台区","石景山","");
   break;
   case "河北":
   var city=new Array("石家庄","唐山","秦皇岛","邯郸","邢台","保定","张家口");
   break;
   }
  // document.form.pro_city.options.length=0;//pro_city的长度定义成0
   for(var i=0;i<city.length+2;i++)
   {
   document.form.pro_city.options[i]=new Option(city[i],city[i-1]);
   //if(document.form.pro_city.options[i].value==" ")//选项是空,判断
   //document.form.pro_city.selectedIndex=i;
   }
  }
 </script>
  <form name="form" method="post" action="">
  <select style="width=20px" name="province" onchange="on_click()">
  <option selected="selected"> 请选择省份</option>
  <option>山东</option>
  <option>北京</option>
  <option >河北</option>
  </select>
  <select name="pro_city"  style="width=20px">
  <option  selected="selected">请选择市区</option>
  </select>
  </form>
</body>
</html>

 

posted on 2012-06-06 16:45  端着咖啡码农  阅读(236)  评论(0编辑  收藏  举报