js二级联动
<body>
<section>
<a>省份</a>
<select id="province">
<option value="0">--请选择--</option>
<option value="1">山东</option> //通过不同的value来区分不同的省份
<option value="2">山西</option>
</select>
<a>城市</a>
<select id="city">
<option>--请选择--</option>
</select>
</section>
</body>
<script>
var arr = new Array();
arr[1] = ["莱芜","济南","东营"];
arr[2] = ["长治","太原","壶关"];
var provinceInput = document.getElementById("province"); //获取省份
var cityInput = document.getElementById("city"); //获取市
provinceInput.onchange = function () {
cityInput.options.length = 1;//当省改变的时候让市的长度为1
for(var i = 0;i < arr[provinceInput.value].length;i++) {
cityInput.add(new Option(arr[provinceInput.value][i])); //向市里面添加对应的数组元素
}
}
</script>
js二级联动的更多相关文章
- 原生js二级联动
今天说的这个是原生js的二级联动,在空白页面里动态添加并作出相对应的效果. 1 //创建两个下拉列表 select标签 是下拉列表 var sel = document.createElement(& ...
- Ext.js二级联动
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <link href ...
- js 二级联动
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
- xml+js+html的二级联动
首先需要准备的文档是: cities.xml //主要是标注中国各省及其各省下的各个城市 内容如下: <?xml version="1.0" encoding="U ...
- 省市二级联动--使用app-jquery-cityselect.js插件
只有省市二级联动,三级联动还没处理好,会尽快完善. 嵌入id: <div class="form-group"> <label>地址</label&g ...
- JS实现下拉单的二级联动
因工作需要,做了一个下拉单的二级联动. 第一级是固定的选项,有A.B两个选项,第二级的选项随着第一级选项的变化而变化. 一开始是这样的: HTML代码 <html> <head> ...
- 利用JS实现一个简单的二级联动菜单
前几天在看js的相关内容,所以就简单写了一个二级联动菜单.分享一下. <!DOCTYPE html> <html lang="en"> <head&g ...
- js：二级联动示例
联动原理 当用户点击省级的下拉选项,选择所在省,下一个下拉选项里的选项,则变成用户选择省下的所有市的信息,不会出现其它省市的信息. 省市数据 把省市数据,保存在js文件中,以json形式保存,以便读取 ...
- js小例子之二级联动
联动原理 当用户点击省级的下拉选项,选择所在省,下一个下拉选项里的选项,则变成用户选择省下的所有市的信息,不会出现其它省市的信息. 省市数据 把省市数据,保存在js文件中,以json形式保存,以便读取 ...
随机推荐
- JAVA-JAVA、JavaScript、JavaWeb的关系
相关资料:1.http://www.cnblogs.com/youring2/archive/2013/06/06/3120645.html2.https://jingyan.baidu.com/ar ...
- JavaScript高级 面向对象（7）--深拷贝与浅拷贝
说明(2017.3.31): 1. 画图: var car = {name:"法拉利"}; var p = {name: "张三", age: "19 ...
- 【精】C# 中的委托和事件（转）
C# 中的委托和事件 引言 委托 和 事件在 .Net Framework中的应用非常广泛,然而,较好地理解委托和事件对很多接触C#时间不长的人来说并不容易.它们就像是一道槛儿,过了这个槛的人,觉得真 ...
- 如何在Windows Server 2008 R2下搭建FTP服务
在Windows Server 2008 R2下搭建FTP服务,供客户端读取和上传文件 百度经验:jingyan.baidu.com 工具/原料 Windows Server 2008 R2 百度经验 ...
- USB 驱动之 usb_register 函数解析
前段时间在kernel 添加了 USB to LAN 模块 AX88772B 的驱动. 根据相关添加解析一下 usb_register_driver 函数 drivers/net/usb/asix.c ...
- Java 日期处理类库Joda-Time简介
http://www.ibm.com/developerworks/cn/java/j-jodatime.html 登录 (或注册) 中文 IBM 技术主题 软件下载 社区 技术讲座 搜索 devel ...
- Quartz 与 Spring集成
http://www.cnblogs.com/pigwing/archive/2011/07/12/2104002.html http://blog.arganzheng.me/posts/quart ...
- hdu2896 病毒侵袭 AC自动机入门题 N(N <= 500)个长度不大于200的模式串(保证所有的模式串都不相同)， M(M <= 1000)个长度不大于10000的待匹配串，问待匹配串中有哪几个模式串，
/** 题目:hdu2896 病毒侵袭 链接:http://acm.hdu.edu.cn/showproblem.php?pid=2896 题意:N(N <= 500)个长度不大于200的模式串 ...
- 利用Nginx搭建RTMP视频直播，点播服务器，ffmpeg推流，回看
一.环境和工具 ubuntu 14.04 desktop 不用server的原因是一部分的演示用到了linux视频播放和直播软件,自己还要装桌面,麻烦. 不建议使用 最新的16TLS,我一开始 ...
- RRD.so文件 rrdruby
ubuntu 12.04绑定rrdruby gem install librrd 用来装rrdruby,这样才能找到RRD.so文件然后在rb文件中加入这两句话: $: << '/path ...