1.js

cities = new Object();
cities['河北省']=new Array('石家庄', '张家口市', '承德市', '秦皇岛市', '唐山市', '廊坊市', '保定市', '沧州市', '衡水市', '邢台市', '邯郸市');
cities['山西省']=new Array('太原市', '大同市', '朔州市', '阳泉市', '长治市', '晋城市', '忻州地区', '吕梁地区', '晋中市', '临汾地区', '运城地区'); function set_city(province, city)
{
var pv, cv;
var i, ii; pv=province.value;
cv=city.value; city.length=; if(pv=='') return;
if(typeof(cities[pv])=='undefined') return; for(i=; i<cities[pv].length; i++)
{
ii = i+;
city.options[ii] = new Option();
city.options[ii].text = cities[pv][i];
city.options[ii].value = cities[pv][i];
} }

2.jsp

 <form name="form1" action="" method="get">
<select name="province" onChange="set_city(this, this.form.city);">
<option value="">选择省</option>
<option value="河北省">河北省</option>
<option value="山西省">山西省</option>
</select>
<select name="city" id="citys">
<option value="">选择城市</option>
</select>
</form>

3.结果截图

Javascript实现二级select联动的更多相关文章

  1. JavaScript(jquery)实现二级菜单联动

    为什么写这篇随笔? 二级菜单的联动一直是我心中一块石头,犹记得大一的时候只会用一点的Dreamweaver,当时做二级菜单难受啊,啥都不会,网上找了些资料,也看不懂别人的代码更别说用起来了 前些日子. ...

  2. 省市联动_简单的Demo,适用于各种二级菜单联动

    最近搞了一个功能,是查询页面需要用到二级菜单联动,获取到选中的属性value传入到后台. 平常都是用AJAX或者JQuery ,通过XML或者JSON的方式,这样的话需要调用数据库,像典型得到省市联动 ...

  3. Ajax和JSON完成二级菜单联动的功能

    首先需要找好JSON的包哦: 链接:http://pan.baidu.com/s/1jH6gN46 密码:lbh1 1:首先创建一个前台页面,比如secondMenu.jsp,源码如下所示: < ...

  4. JS中简单的二级城市联动

    代码奉上: <!DOCTYPE html><html><head>    <meta charset="UTF-8">    < ...

  5. 前端基础之BOM和DOM(响应式布局、计时器、搜索框、select联动)

    一.BOM和DOM JavaScript分为 ECMAScript,DOM,BOM. BOM(Browser Object Model)是指浏览器对象模型,它使 JavaScript 有能力与浏览器进 ...

  6. JS BOM DOM对象 select联动 计时器 时间 css操作 节点(标签 ) 查找标签 {前端基础之BOM和DOM}

    前端基础之BOM和DOM 前戏 到目前为止,我们已经学过了JavaScript的一些简单的语法.但是这些简单的语法,并没有和浏览器有任何交互. 也就是我们还不能制作一些我们经常看到的网页的一些交互,我 ...

  7. 前端基础之BOM和DOM和三个小示例(计时器、搜索框、select联动)

    一.BOM和DOM JavaScript分为 ECMAScript,DOM,BOM. BOM(Browser Object Model)是指浏览器对象模型,它使 JavaScript 有能力与浏览器进 ...

  8. Javascript: Let user select an HTML element like Firebug?综述

    Javascript: Let user select an HTML element like Firebug? Javascript: Let user select an HTML elemen ...

  9. select联动遇到的问题

    今天写了个select下拉联动,记录下过程中遇到的问题. dom部分 // 拿到选中项的索引 myselect.selectedIndex // 拿到选中项的text/value myselect.o ...

随机推荐

  1. LoadRunner培训初级教程

    一 LoadRunner简介 1.1 Loadrunner介绍 LoadRunner 是 HP Mercury Interactive 用来测试应用程序性能的工具  LoadRunner 通过模拟一个 ...

  2. 字符转换(C、C++)

    标准C和C++库提供了一些转换工具.但是它们在易用性.扩展型和安全型上各有不同. 例如,以atoi为代表的一系列标准C函数就有一些限制: * 只支持单向转换:从文本到内部数据类型.要用C库函数实现另一 ...

  3. WPF中通过代码设置控件的坐标

    用WPF做贪吃蛇小游戏时,发现了一个问题: 贪吃蛇的移动,我是通过不断刷新Rectangle来实现(贪吃蛇的身体由一组Rectangle组成),因此需要不断调整Rectangle的坐标,但是WPF中没 ...

  4. 【转】不容忽视的ClassNotFoundException

    转载地址:http://it.deepinmind.com/jvm/2014/04/11/classnotfoundexception-is-it-slowing-down-your-jvm.html ...

  5. ShowDoc部署手册

    ShowDoc介绍 关于ShowDoc的介绍,请访问:http://blog.star7th.com/2015/11/1816.html 环境依赖 1.必需环境 PHP5.3以上版本.php-gd库 ...

  6. java udp与tcp

    一:基础  NET基本对象java.net.InetAddress类的使用 IP地址是IP使用的32位(IPv4)或者128位(IPv6)位无符号数字,它是传输层协议TCP,UDP的基础.InetAd ...

  7. 课堂 表单验证 JavaScript js

    页面加载完才开始执行代码要加上 window.onload = function{ } 获取元素节点 var uesrname = document.getElementById("user ...

  8. 大数据 > 数据平台方案评估

    分类 当前措施 说明 百度竞价如何进行数据分析(SEM工程师)数据来源: 1. 百度后台推广数据:api 总展现 总点击 点击率 总消费 点击均价 BDP功能点 1. 串联百度->网站商务通-& ...

  9. Mac > 编写跨平台桌面应用开发工具,基于 Web 技术

    Electron: The Electron framework lets you write cross-platform desktop applications using JavaScript ...

  10. Thinkphp各大支付平台在线支付集成源码

    用Thinkphp给客户开发网站的时候需要用到各大平台付款功能,下面就免费分享给大家,此类是个成熟类,网上down下来的,经过修改测试了(可以直接拿来使用,附带使用方法,有需要的朋友请拿走.),如果有 ...