mysky

 

select 动态菜单

<form>
 <select id="province">
  <option value="">省份</option>
  <option value="北京">北京</option>
  <option value="上海">上海市</option>
  <option value="河南">河南省</option>
  <option value="河北">河北省</option>
  <option value="江苏">江苏省</option>
 </select>
 &nbsp;&nbsp;
 <select id="city">
  <option>城市</option>
 </select>
</form>

//javascript 部分

<script type="text/javascript">
window.onload=initForms;
function initForms(){
 if(!document.getElementById) return false;
 document.getElementById("province").selectedIndex=0;
 document.getElementById("province").onchange=chgCity;
}
function chgCity(){
 var bjCity=new Array("北京市");
 var shCity=new Array("上海市");
 var hnCity=new Array("郑州","安阳","濮阳","新乡","鹤壁","洛阳");
 var hbCity=new Array("石家庄","保定","邯郸","秦皇岛","邢台","临漳");
 var jsCity=new Array("南京","徐州","连云港","宿迁","镇江","无锡");
 var theCity=document.getElementById("city");
 var Cities=this.options[this.selectedIndex].value;
 switch(Cities){
  case "北京":
   theCity.options.length=0;
   for(var i=0;i<bjCity.length;i++){
    theCity.options[theCity.options.length]=new Option(bjCity[i]);
   }
   break;
  case "上海":
   theCity.options.length=0;
   for(var i=0;i<shCity.length;i++){
    theCity.options[theCity.options.length]=new Option(shCity[i]);
   }
   break;
  case "河南":
   theCity.options.length=0;
   for(var i=0;i<hnCity.length;i++){
    theCity.options[theCity.options.length]=new Option(hnCity[i]);
   }
   break;
  case "河北":
   theCity.options.length=0;
   for(var i=0;i<hbCity.length;i++){
    theCity.options[theCity.options.length]=new Option(hbCity[i]);
   }
   break;
  case "江苏":
   theCity.options.length=0;
   for(var i=0;i<jsCity.length;i++){
    theCity.options[theCity.options.length]=new Option(jsCity[i]);
   }
   break;
  case "":
   theCity.options.length=0;
   theCity.options[0]=new Option("城市");
   break;
  default:
   break;
 }
}
</script>

  

posted on 2008-09-16 12:50  abu  阅读(228)  评论(1编辑  收藏  举报

导航