js简单省级联动菜单
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>省市级联</title>
</head>
<body>
<select id="sheng">
<option>-请选择-</option>
</select>
<select id="city">
<option>-请选择-</option>
</select>
</body>
<script type="text/javascript">
//加载方法
onload = checkcity;
//封装方法
function checkcity(){
//获取省份的id
var sheng = document.getElementById("sheng");
//创建数组
var arr = new Array();
arr['江西省']=['南昌市','赣州市'];
arr['河南省']=['郑州市','洛阳市'];
//获取省份
for(var i in arr){
sheng.add(new Option(i,i),null);
}
//获取市
sheng.onchange = function(){
var sheng = document.getElementById("sheng").value;
var city = document.getElementById("city");
city.length = 0;
//迭代级联
for(var k in arr[sheng]){
city.add(new Option(arr[sheng][k],arr[sheng][k]),null);
}
}
}
</script>
</html>
js简单省级联动菜单的更多相关文章
- 学习 | 基于require.js的三级联动菜单【入门】
主要目的是学习如何使用require.js AMD就是通过延迟和按需加载来解决各个模块的依赖关系,其中require就是AMD的框架之一 它的优点是可以解决以下问题: JS文件的依赖关系. 通过异步加 ...
- 30行代码实现js原生三级联动菜单
var oneArr=[['00','成都'],['01','绵阳'],['02','南充']] var towArr={ '00':[['000','武侯区'],['002','锦江区']], '0 ...
- 利用JS实现一个简单的二级联动菜单
前几天在看js的相关内容,所以就简单写了一个二级联动菜单.分享一下. <!DOCTYPE html> <html lang="en"> <head&g ...
- js封装的三级联动菜单(使用时只需要一行js代码)
前言 在实际的项目开发中,我们经常需要三级联动,比如省市区的选择,商品的三级分类的选择等等. 而网上却找不到一个代码完整.功能强大.使用简单的三级联动菜单,大都只是简单的讲了一下实现思路. 下面就给大 ...
- [JS]以下是JS省市联动菜单代码
以下是JS省市联动菜单代码: 代码一: <html> <head> <title></title> <script language=" ...
- phpcms v9联动菜单的调用方法及get_linkage函数简单过程
{get_linkage($r['areaid'],1,' >> ',1)} 复制代码 当然这个 $r 也不是绝对的.要看你的loop 是如何写的. {loop $data $n $r} ...
- MVC实现省级联动
前言 省级联动的效果,网上现成的都有很多,各种JS实现,Jquery实现等等,今天我们要讲的是在MVC里面,如何更方便.更轻量的实现省级联动呢? 实现效果如下: 具体实现 如图所示,在HTML页非常简 ...
- Ajax-ajax实例4-多级联动菜单
项目结构: 项目运行: 技术要点: 1.4.1 技术要点在分析具体的实现代码之前,先介绍一下本例的几个技术要点.1 ．选项的动态创建与删除document 对象的 createElement 方法可以 ...
- jQuery简单的手风琴菜单
查看效果:http://keleyi.com/keleyi/phtml/menu/5.htm 本菜单的HTML代码和JS代码都简洁,完整源代码: <!DOCTYPE html PUBLIC &q ...
随机推荐
- java集合框架05——ArrayList和LinkedList的区别
前面已经学习完了List部分的源码,主要是ArrayList和LinkedList两部分内容,这一节主要总结下List部分的内容. List概括 先来回顾一下List在Collection中的的框架图 ...
- github fork, star and watch
1 git fork git clone原版本的话,只有读权限,是不能直接把修改提交到服务器的. git fork会创建一个副本,然后就可以在这个上面进行开发了,开发了之后可以通过pull reque ...
- 利用Eclipse的JPA自动生成注解实体
新公司用的SSH(springmvc)框架,看代码的时候,发现没有hbm.xml文件,全部使用的注解形式.在一次闲聊的时候问同事,这么多entity 写起来不麻烦么.同事说根据数据库自动生成的.于是 ...
- 第八讲：I/O虚拟化
一.I/O虚拟化的产生 服务器单个千兆以太网端口肯定能够支持单个应用,但是当被分割为10个.15个或者更多的服务器负载时(这其中包括网络.存储以及服务器之间的流量)可能就不够用了. 当遇到I/O瓶颈时 ...
- 康复计划#5 Matrix-Tree定理(生成树计数)的另类证明和简单拓展
本篇口胡写给我自己这样的什么都乱证一通的口胡选手 以及那些刚学Matrix-Tree,大致理解了常见的证明但还想看看有什么简单拓展的人- 大概讲一下我自己对Matrix-Tree定理的一些理解.常见版 ...
- Linux的capability深入分析
Linux的capability深入分析详见:http://blog.csdn.net/u014338577/article/details/48791953 lxd中对容器能力的限制: 普通用户不能 ...
- 快捷配置Hibernate实现对数据库的配置(构建通道)
在基于MVC设计模式的JAVA WEB应用中,Hibernate可以作为模型层/数据访问层.它通过配置文件(hibernate.properties或hibernate.cfg.xml)和映射文件(* ...
- JavaScript:void(0);的作用
JavaScript中void是一个操作符,该操作符指定要计算一个表达式但是不返回值. void 操作符用法格式如下: 1. javascript:void (expression) 2. javas ...
- 关于Java空指针的控制(转)
1)在已经的String(字符串)调用 equal()和 equalsingnoreCase()而不是未知的对象 通常在已经的非空字符串在调用equals().因为equal()方法是对称的,调用a. ...
- Bat小试牛刀
前天版本发布后同事才发现有点小瑕疵,当然这是前期的设计和测试没到位造成的.撇开这些不说,我想说的是知识面广一点,做起事情来可能更得心应手些. 大致是这样的,由于版本的迭代,导致发布的程序只能清除一部分 ...