JAVAScript 实现的城市联动菜单


<script>
/*
 作者:fibona(熊祥众)
 写作日期:2005年12月
 实现功能;实现一个静态的城市与省区选择的联动菜单
 这主要讲述的是一个联动选择的实现原理,可以通过此原理实现动态的联动选择
*/
</script>


<script language="JavaScript">

function validate(theform)
{

//alert(document.all.city.value);

if (document.all.city.value == "")
{
        alert("城市值非空");
        return false;
}else{
return true;
}
}
</script>
<form method="post" name="form1" action="#" enctype="multipart/form-data" onSubmit="return validate(this)">
<tr>
<td bgcolor="#F8F8F8" width="20%">选择城市:</td>
<td bgcolor="#FFFFFF"><select name="city"onChange=changelocation(this.value)>
  <option value="" selected>>>>>请选择<<<<</option>
  <OPTION value='1' >北京</OPTION><OPTION value='2' >上海</OPTION><OPTION value='3' >湖南 </OPTION>
  </select></td>
</tr>
<tr>
<td bgcolor="#F8F8F8" width="20%">选择市或者城区:</td>
<td bgcolor="#FFFFFF">  <select name="area">
 <SCRIPT language=JavaScript>
 var onecount;
 onecount=0;
 subcat = new Array();
 subcat[0] = new Array(1,'东城');
 subcat[1] = new Array(1,'西城');
 subcat[2] = new Array(1,'丰台');
 subcat[3] = new Array(1,'海淀');
 subcat[4] = new Array(1,'通州');
 subcat[5] = new Array(1,'其它区');
 subcat[6] = new Array(2,'奉贤');
 subcat[7] = new Array(2,'南汇');
 subcat[8] = new Array(2,'青浦');
 subcat[9] = new Array(2,'松江');
 subcat[10] = new Array(2,'徐汇');
 subcat[11] = new Array(2,'浦东');
 subcat[12] = new Array(3,'长沙');
 subcat[13] = new Array(3,'永州');
 subcat[14] = new Array(3,'衡阳');
 onecount=15;
 function changelocation(locationid)
 {  
  
  document.all.area.length = 0;
  var locationid=locationid;
  var i,flag=0;
  for (i=0;i < onecount; i++)
  {
  if (subcat[i][0] == locationid)
  {
  document.all.area.options[document.all.area.length] = new Option(subcat[i][1]);
  flag=1;
  }
  }
  if (flag==0)
  {document.all.options.options[document.all.area.length] = new Option('>>>>选择市或者区<<<<');
  }
 }</SCRIPT>
  <option value="" selected>>>>>选择市或者区<<<<</option>
  </select></td>
</tr>
<input type="submit" name="topicsubmit" value="提交" tabindex="5">
</form>

发布了39 篇原创文章 · 获赞 12 · 访问量 20万+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章