JavaScript 省市级联效果

 <!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>

     <title>省市级联效果</title>

     <script type="text/javascript">

         function show() {

             var citys = new Array();

             citys["湖北省"] = ["襄樊市", "武汉市", "随州市", "荆门市", "黄石市", "恩施市", "咸宁市", "仙桃市", "十堰市", "孝感市", "利川市"];

             citys["湖南省"] = ["长沙市", "吉首市", "湘潭市", "益阳市", "津市市", "洪江市", "怀化市", "冷水江市", "衡阳市", "郴州市", "永州市", "邵阳市", "岳阳市"];

             citys["广东省"] = ["广州市", "深圳市", "佛山市", "汕头市", "珠海市", "韶关市", "江门市", "湛江市", "惠州市", "中山市", "东莞市"];

             citys["北京市"] = ["朝阳区", "丰台区", "崇文区", "宣武区", "海淀区", "顺义区", "平谷区", "怀柔区", "房山区", "东城区", "西城区"];

             document.getElementById("shi").options.length = 1;

             var sheng = document.getElementById("sheng").value;

             var newCity;

             if (sheng != "-=请选择=-") {

                 for (var i = 0; i < citys[sheng].length; i++) {

                     newCity = new Option(citys[sheng][i], citys[sheng][i]);

                     document.getElementById("shi").options.add(newCity);

                 }

             }

         }

     </script>

 </head>

 <body>

     <div>

         <select id="sheng" onchange="show()">

             <option value="-=请选择=-">-=请选择=-</option>

             <option value="湖北省">湖北省</option>

             <option value="湖南省">湖南省</option>

             <option value="广东省">广东省</option>

             <option value="北京市">北京市</option>

         </select>

         <select id="shi">

             <option>-=请选择=-</option>

         </select>

     </div>

 </body>

 </html>

JavaScript 省市级联效果的更多相关文章

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

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

  2. javascript中的省市级联效果

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

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

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

  4. JavaScript学习笔记- 省市级联效果

    <!DOCTYPE html> <html lang="en" xmlns="http://www.w3.org/1999/xhtml"> ...

  5. 省市级联.net

    初学javascript,编译省市级联,使用json在一般处理程序中编译,利用ajax传递数据到web前台 <html xmlns="http://www.w3.org/1999/xh ...

  6. bootstrap中table页面做省市区级联效果(级联库见前面级联编辑)(非select下拉框)

    <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...

  7. js省市级联实现

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

  8. [C#]使用 C# 代码实现拓扑排序 dotNet Core WEB程序使用 Nginx反向代理 C#里面获得应用程序的当前路径 关于Nginx设置端口号，在Asp.net 获取不到的，解决办法 .Net程序员 初学Ubuntu ，配置Nignix 夜深了，写了个JQuery的省市区三级级联效果

    [C#]使用 C# 代码实现拓扑排序   目录 0.参考资料 1.介绍 2.原理 3.实现 4.深度优先搜索实现 回到顶部 0.参考资料 尊重他人的劳动成果,贴上参考的资料地址,本文仅作学习记录之用. ...

  9. Ajax异步刷新省市级联

    省市级联在web前端用户注册使用非常广泛.Ajax异步刷新省市级联.如图:选择不同的区,自动加载相应的街. <TD class=field>位 置:</TD> <TD&g ...

随机推荐

  1. 3.Struts2配置文件标签介绍

    Struts2的很多核心功能都是由拦截器实现的. struts-default.xml中定义了这些拦截器与Result类型. 所以,不继承struts-default包,Struts2提供的很多核心功 ...

  2. 实现一个纵向排列的 ListBox ，并具有操作按钮

    需要实现的效果如下: 要想把 ListBox 的内容纵向显示很简单,只需把 ListBox 的内容控件为 WrapPanel 就可以了: <ListBox.ItemsPanel> < ...

  3. 12306火车票查询--python

    最近我看到看到使用python实现火车票查询,我自己也实现了,感觉收获蛮多的,下面我就把每一步骤都详细给分享出来.(注意使用的是python3) 首先我将最终结果给展示出来: 在cmd命令行执行:py ...

  4. 使用css3新属性clip-path制作小图标

    一般一个网页上面,或多或少都会用到一些小图标,展示这些小图标的方法有很多种.最简单的做法就是将UI图上面的每个小图标都保存为图片,一个小图标就一张图片.但这也是比较笨的方法,因为浏览器同一时间最多加载 ...

  5. 减少生成的dll数量

    在开篇之前我想鄙视我自己一下,这个东西根本不需要去写,本来已经有东西去实现了,正如我组长说我的,看的开源项目太少了.其实这个东西完全可以用ILMerge来解决. 然后再说说前言,开发东西久了,总会积累 ...

  6. 异步编程系列第02章 你有什么理由使用Async异步编程

    p { display: block; margin: 3px 0 0 0; } --> 写在前面 在学异步,有位园友推荐了<async in C#5.0>,没找到中文版,恰巧也想提 ...

  7. C# Socket异步聊天例子

    最近在配合游戏服务器端搞一个客户端通信,客户端是unity搞的,理所当然就高C#了,上手之前先看了一下C# Socket通信这一块,基本不考虑同步方式,而异步方式,微软也提供了两套API,一套是Beg ...

  8. Windows 10 下mysql 安装后无法启动问题

    安装过程: 1. 官网下载5.15.7, http://dev.mysql.com/downloads/, 选择开源社区版:MySQL Community Server (GPL) 2. 我解压后放在 ...

  9. python基础之文件处理

    读和写文件 读写文件是最常见的IO操作.Python内置了读写文件的函数,用法和C是兼容的. 读写文件前,我们先必须了解一下,在磁盘上读写文件的功能都是由操作系统提供的,现代操作系统不允许普通的程序直 ...

  10. svg.js教程及使用手册详解（一）

    做毕设的时候,因为要使用到画图和自定义动画,所以接触到了SVG.网上关于SVG和Canvas的对比很多,具体的辨析这里就不赘言.网上关于SVG的所谓教程基本上都是SVG本身,但是却没有一个针对svg. ...