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. 在ASP.NET MVC 中获取当前URL、controller、action

    一.URL的获取很简单,ASP.NET通用: [1]获取 完整url (协议名+域名+虚拟目录名+文件名+参数) string url=Request.Url.ToString(); [2]获取 虚拟 ...

  2. spring boot 添加拦截器

    构建一个spring boot项目. 添加拦截器需要添加一个configuration @Configuration @ComponentScan(basePackageClasses = Appli ...

  3. 12款响应式 Lightbox(灯箱)效果插件

    灯箱效果(Lightbox)是网站中最常用的效果之一,用于实现类似模态对话框的效果.网络上各种 Lightbox 插件琳琅满目,随着响应式设计(Respnsive Design)的发展,这一先进理念也 ...

  4. Winform应用程序实现通用消息窗口

    记得我之前发表过一篇文章<Winform应用程序实现通用遮罩层>,是实现了透明遮罩的消息窗口,功能侧重点在动图显示+消息提醒,效果看上去比较的炫,而本篇我又来重新设计通用消息窗口,功能重点 ...

  5. 【转】 App架构设计经验谈:接口的设计

    App与服务器的通信接口如何设计得好,需要考虑的地方挺多的,在此根据我的一些经验做一些总结分享,旨在抛砖引玉. 安全机制的设计 现在,大部分App的接口都采用RESTful架构,RESTFul最重要的 ...

  6. LINQ to SQL语句(11)之Update

    说明:更新操作,先获取对象,进行修改操作之后,直接调用SubmitChanges()方法即可提交.注意,这里是在同一个DataContext中,对于不同的DataContex看下面的讲解. 1.简单形 ...

  7. 怎样制作web版的folder treeview

    文件夹treeview的效果 这样的treeview在实际项目中使用的场景较多. 既然用的多,那就DIY一遍,虽没有面面俱到,但也要将其基本实现完成一遍. 1.先准备图标素材  file.gif,文件 ...

  8. redis主从复制 从而 数据备份和读写分离

    蜗牛Redis系列文章目录http://www.cnblogs.com/tdws/tag/NoSql/ 爬虫转载注明地址本文地址—博客园蜗牛 http://www.cnblogs.com/tdws/p ...

  9. 设计模式(五)建造者模式(Builder Pattern)

    一.引言 在软件系统中,有时需要创建一个复杂对象,并且这个复杂对象由其各部分子对象通过一定的步骤组合而成.例如一个采购系统中,如果需要采购员去采购一批电脑时,在这个实际需求中,电脑就是一个复杂的对象, ...

  10. DataTable转实体Model,DataRow转实体Model,DataTable转泛型T,DataRow转泛型T

    前言,此方法利用反射将DataRow转成实体,由于反射性能不行,大家就看看就行了吧. 代码来啦 using System; using System.Collections.Generic; usin ...