<!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简单省级联动菜单的更多相关文章

  1. 学习 | 基于require.js的三级联动菜单【入门】

    主要目的是学习如何使用require.js AMD就是通过延迟和按需加载来解决各个模块的依赖关系,其中require就是AMD的框架之一 它的优点是可以解决以下问题: JS文件的依赖关系. 通过异步加 ...

  2. 30行代码实现js原生三级联动菜单

    var oneArr=[['00','成都'],['01','绵阳'],['02','南充']] var towArr={ '00':[['000','武侯区'],['002','锦江区']], '0 ...

  3. 利用JS实现一个简单的二级联动菜单

    前几天在看js的相关内容,所以就简单写了一个二级联动菜单.分享一下. <!DOCTYPE html> <html lang="en"> <head&g ...

  4. js封装的三级联动菜单(使用时只需要一行js代码)

    前言 在实际的项目开发中,我们经常需要三级联动,比如省市区的选择,商品的三级分类的选择等等. 而网上却找不到一个代码完整.功能强大.使用简单的三级联动菜单,大都只是简单的讲了一下实现思路. 下面就给大 ...

  5. [JS]以下是JS省市联动菜单代码

    以下是JS省市联动菜单代码: 代码一: <html> <head> <title></title> <script language=" ...

  6. phpcms v9联动菜单的调用方法及get_linkage函数简单过程

    {get_linkage($r['areaid'],1,' >> ',1)} 复制代码 当然这个 $r 也不是绝对的.要看你的loop 是如何写的. {loop $data $n $r} ...

  7. MVC实现省级联动

    前言 省级联动的效果,网上现成的都有很多,各种JS实现,Jquery实现等等,今天我们要讲的是在MVC里面,如何更方便.更轻量的实现省级联动呢? 实现效果如下: 具体实现 如图所示,在HTML页非常简 ...

  8. Ajax-ajax实例4-多级联动菜单

    项目结构: 项目运行: 技术要点: 1.4.1 技术要点在分析具体的实现代码之前,先介绍一下本例的几个技术要点.1 ．选项的动态创建与删除document 对象的 createElement 方法可以 ...

  9. jQuery简单的手风琴菜单

    查看效果:http://keleyi.com/keleyi/phtml/menu/5.htm 本菜单的HTML代码和JS代码都简洁,完整源代码: <!DOCTYPE html PUBLIC &q ...

随机推荐

  1. Linux驱动技术(五) _设备阻塞/非阻塞读写

    等待队列是内核中实现进程调度的一个十分重要的数据结构,其任务是维护一个链表,链表中每一个节点都是一个PCB(进程控制块),内核会将PCB挂在等待队列中的所有进程都调度为睡眠状态,直到某个唤醒的条件发生 ...

  2. 一个基于POI的通用excel导入导出工具类的简单实现及使用方法

    前言: 最近PM来了一个需求,简单来说就是在录入数据时一条一条插入到系统显得非常麻烦,让我实现一个直接通过excel导入的方法一次性录入所有数据.网上关于excel导入导出的例子很多,但大多相互借鉴. ...

  3. C++模板杂谈

    在模板编程中,有几个常用的技术:模板(偏)特化,特性萃取,标签分派,匹配失败不是错误.其中模板(偏)特化是基础,匹配失败不是错误(SFINAE)应用最为广泛. 现代C++对模板编程做了更多的加强,bo ...

  4. 利用nodejs监控文件变化并使用sftp上传到服务器

    很久没写博客了,因为最近在用react+express做一个自己的工具型网站(其实就是夺宝岛抢拍器) 然后因为经常要改动,而且又要放到服务器上进行测试.总是要webpack,然后手动把文件上传上去,不 ...

  5. unity3d为什么会有三种脚本语言？

    相信这个问题多多少少会令许多初学者感到困惑,因为他们不知道应该选择哪种语言好,但是都会从以下几个方面进行考虑: 1.学习成本.哪门语言让我快速上手. 2.文档帮助.说白了就是出了问题,有没有人能解决. ...

  6. fiddler介绍

    先看fiddler 的使用界面和各模块的功能介绍 1请求列表:请求列表中包含了许多信息,从左至右依次为,#(序列号),Result(结果状态码),Prottocol(请求的协议),Host(请求的主机 ...

  7. java基础之路（二）上

    &和&&的区别 我们今天就来说一下&与&&运算符的区别 &运算符有两种用法:(1)按位与:(2)逻辑与.&&运算符是短路与运算. ...

  8. canvas随笔

    公司刚刚处于创业初期,总是会尝试着做一些新奇的东西.尤其是对于网上一些好玩的东西,总是希望自己也能有一样的功能.不得不说,对于我来说,既是种机遇,也是种挑战.因为这样给了我足够的发展空间,可以按着自己 ...

  9. 【2-24】for循环嵌套，跳转语句，异常语句，穷举法、迭代法

    For循环嵌套与if嵌套相似,是在for中再套for,其结构如下: For(;;) { For(;;){} }经典题型为打印星星例: Console.Write("请输入一个奇数:" ...

  10. （十） Jquery的基本使用

    一.引入 注意:如果在index.js中有使用到JQuery.js 那么JQuery.js文件必须比index.js文件先引入,否则index.js文件中不能使用JQuery.js. <scri ...