码迷,mamicode.com
首页 > Web开发 > 详细

Js实现简单的省市级联的效果

时间:2014-09-18 22:02:04      阅读:161      评论:0      收藏:0      [点我收藏+]

标签:style   blog   color   io   os   java   ar   for   div   

需要注意的是当需要动态添加项的时候一定要
先var newoption=new Option("项","值");
然后再 select.options.add(newoption);
这样才能添加进去
代码如下:

<html>
<head>
<script language="javascript">
 function changeSever()
 {
  var newop1,newop2;                              //声明两个变量用来添加Option项
  switch(document.form1.select1.value)            //判断选择的项,注意这里是值不是所选的项,是所选项的值
  {
   case "lt":
    newop1=new Option("雷霆1区","lt1");
    newop2=new Option("雷霆2区","lt2");
    break;
   case "ty":
    newop1=new Option("天涯1区","lt1");
    newop2=new Option("天涯2区","lt2");
    break;
  }
  document.form1.select2.options.length=0;          //把所有的项清空
  document.form1.select2.options.add(new Option("请选择相应的服务器"));
  document.form1.select2.options.add(newop1);       //添加项
  document.form1.select2.options.add(newop2);
 }
</script>
</head>

<body>
<form name="form1" method="post" action="">
  <select name="select1" onChange="changeSever()">         //父下拉框
    <option selected>请选择所在区</option>
    <option value="lt">雷霆</option>
    <option value="ty">天涯</option>
  </select>
  <p><select name="select2">                             //子下拉框
    <option>请选择服务器</option>
  </select>
</form>

</body>
</html>

 

Js实现简单的省市级联的效果

标签:style   blog   color   io   os   java   ar   for   div   

原文地址:http://www.cnblogs.com/xyyt/p/3980071.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!