需要注意的是当需要动态添加项的时候一定要
先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实现简单的省市级联的效果的更多相关文章

  1. 纯js实现省市级联效果

    我们都知道一般有注册的时候会让用户填入省市啊地区什么的,然后我就想使用纯js制作一个省市级联的效果,只是用于学习以及回顾温习用,首先看下效果图,界面很丑啊,不要嫌弃! 首先还是先看下我的项目目录吧 很 ...

  2. JavaScript 省市级联效果

    JavaScript 省市级联效果 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" " ...

  3. 原生JS封装简单动画效果

    原生JS封装简单动画效果 一致使用各种插件,有时候对原生JS陌生了起来,所以决定封装一个简单动画效果,熟悉JS原生代码 function animate(obj, target,num){ if(ob ...

  4. JavaScript实现省市级联效果实例

    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/ ...

  5. javascript中的省市级联效果

    学习javascript的时候都遇到过这样的需求,不仅是省市,还有其他的一些场景,看看关键的代码有哪些吧. <head runat="server"> <titl ...

  6. js省市级联实现

    js省市级联实现. for [element] in [collection] 用于循环下标,常用于json for(index in arr){ console.info("下标:&quo ...

  7. HTML(.js) – 最简单的方式操作 DOM 的 JS 库

    HTML(.js) 是一个轻量的(压缩后~2kb) JavaScript 库,简化了与 DOM 交互的方法. 这个 JavaScript 库的方法可读性很好,并具有搜索和遍历 DOM 的方法.相比 j ...

  8. WOW.js轻松为网页添加动画切入效果

    由于坐忘的需要,经常会有部分功能用的很多,做起来又很繁琐,所以插件也就应运而生了.个人感觉正式js强大的可植入性, 才使他如此的使用火爆,反正博主是特别喜欢这一点  Y(^o^)Y~ . 今天就和大家 ...

  9. JS的简单用法

    JS的简单用法 参考:http://www.w3school.com.cn/js/js_switch.asp JavaScript 是网络的脚本语言 JavaScript 是可插入 HTML 页面的编 ...

随机推荐

  1. add host bat

    ::Author > mdt jindahao ::Data > @echo off title 添加记录到HOST--------Powerd by LoveQishi echo. ec ...

  2. Java和Android Http连接程序：使用java.net.URL 下载服务器图片到客户端

    Java和Android Http连接程序:使用java.net.URL 下载服务器图片到客户端 本博客前面博文中利用org.apache.http包中API进行Android客户端HTTP连接的例子 ...

  3. CoreDataManager-OC版-兼容iOS10以前的版本

    头文件: #import <Foundation/Foundation.h> #import <CoreData/CoreData.h> /** CoreData管理器 */ ...

  4. Ubuntu 安装WPS

    1.到官网下载deb安装包 http://community.wps.cn/download/ 2.安装 sudo dpkg -i wps-office_10.1.0.5672~a21_amd64.d ...

  5. 【iOS】block的使用

    Block 是iOS在4.0之后新增的程式语法,一般用于回调方法,功能上和delegate类似.本文将讲解block的几种常见的使用方法,当然,block中最值得注意的还是它的内存管理,我将在< ...

  6. 优化MySchool数据库（一）

    <优化MyShcool数据库>:能够的独立的分析|设计|创建|运营|你的独立的数据库系统 设计--->实现--->TSQL--->查询优化---->性能优化技术-- ...

  7. AES加密解密

    AES简介 美国国家标准技术研究所在2001年发布了高级加密标准(AES).AES是一个对称分组密码算法,旨在取代DES成为广泛使用的标准. 根据使用的密码长度,AES最常见的有3种密钥方案,用以适应 ...

  8. uniqid函数产生唯一id，减少碰撞几率

    $uuid = str_replace(".","",uniqid(mt_rand(100000,999999),true)); //基于当前时间微妙数,与mt ...

  9. yii2 rbac权限控制之菜单menu详细教程

    作者:白狼 出处:http://www.manks.top/article/yii2_rbac_menu本文版权归作者,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接,否则 ...

  10. xxx is not in the sudoers file.This incident will be reported.的解决方法 （一般用户不能执行sudo）

    1.切换到root用户下 2.添加sudo文件的写权限,命令是:chmod u+w /etc/sudoers 3.编辑sudoers文件vi /etc/sudoers找到这行 root ALL=(AL ...