联动菜单：

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Document</title>

    <style>

        #div1{

            width: 300px;

            height: 300px;

            background: blue;

            border-bottom: 1px solid black;

        }

    </style>

    <script>

        var area = [

            ['朝阳', '海淀', '昌平'],

            ['九江', '南昌', '赣州']

        ];

        function ld(){

            var select = document.getElementById("province");

            var city = document.getElementById("city");

            var opt = null;

            if(select.value == -1){

                city.innerHTML = opt;

                return;

            }

            for(var i = 0; i < area[select.value].length; i++){

                opt += "<option value="+i+">"+area[select.value][i]+"</option>";

            }

            city.innerHTML = opt;

        }

    </script>

</head>

<body>

    <select name="" id="province" onchange="ld();">

        <option value="-1">请选择</option>

        <option value="0">北京</option>

        <option value="1">江西</option>

    </select>

    <select name="" id="city"></select>

</body>

</html>

更多：http://www.yanshiba.com/code/liandong/index.html

Javascript 笔记与总结（2-12）联动菜单的更多相关文章

  1. 《DWZ笔记一》<select>动态联动菜单

    联动菜单,即组合框Combo box,在DWZ文档中对组合框combox的是这样描述的: 在传统的select 用class 定义:class=”combox”, html 扩展:保留原有属性name ...

  2. Javascript 笔记与总结（1-2）词法分析

    词法分析,按顺序分析 3 样: 第 1 步:先分析参数 第 2 步:再分析变量声明 第 3 步:再分析函数声明 一个函数能使用的局部变量,就从上面 3 步分析而来. 具体步骤: 0:函数运行前的瞬间, ...

  3. 转: javascript实现全国城市三级联动菜单代码

    <html> <head> <title>js全国城市三级联动菜单代码_B5教程网</title> <meta http-equiv=" ...

  4. 通过Javascript数组设计一个省市联动菜单

    通过Javascript数组设计一个省市联动菜单 使用Option内置类来完成下拉选项的创建 2.使用定时器实现一个时钟程序 3.使用PHP+JSON完成语音验证码 网址:http://yuyin.b ...

  5. ThinkPHP实现联动菜单；

    联动菜单,首先给你看看前端是怎么写的:

  6. 基于jQuery的AJAX实现三级联动菜单

    最近学习jQuery,所以就写了一个关于中国省市县/区的三级联动菜单,权当相互学习,相互促进,特此记录. 下面是嵌套js的html文件: <!DOCTYPE html> <html ...

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

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

  8. JS读书心得：《JavaScript框架设计》——第12章 异步处理

    一.何为异步   执行任务的过程可以被分为发起和执行两个部分. 同步执行模式:任务发起后必须等待直到任务执行完成并返回结果后,才会执行下一个任务. 异步执行模式:任务发起后不等待任务执行完成,而是马上 ...

  9. 开发一个jQuery插件——多级联动菜单

    引言 开发中,有好多地方用到联动菜单,以前每次遇到联动菜单的时候都去重新写,代码重用率很低,前几天又遇到联动菜单的问题,总结了下,发现可以开发一个联动菜单的功能,以后想用的时候就方便多了.项目中每个页 ...

随机推荐

  1. JPush开发

    主要功能 保持与服务器的长连接,以便消息能够即时推送到达客户端 接收通知与自定义消息,并向开发者App 传递相关信息 SDK集成步骤 1.导入 SDK 开发包到你自己的应用程序项目 解压缩 jpush ...

  2. Android实现边缘凹凸的View

    转载 最近做项目的时候遇到一个卡劵的效果,由于自己觉得用图片来做的话可以会出现适配效果不好,再加上自己自定义view方面的知识比较薄弱,所以想试试用自定义View来实现.但是由于自己知识点薄弱,一开始 ...

  3. SQL表格

    LAMP - Linux  Apache MySQL PHP MySQL - 三个层次:文件层次,服务层次,界面 常用的数据类型:int 整数float double decimal 小数varcha ...

  4. PHP数组的使用方法小结

    数组就是一组数据的集合,把一系列数据组织起来,形成一个可操作的整体.数组的每个实体都包含两项:键和值. 一.什么是数组数组就是一组数据的集合,把一系列数据组织起来,形成一个可操作的整体.数组的每个实体 ...

  5. [译] UML中的关系之Dependency

    在UML中,依赖关系表示Client依赖于另一个元素,叫做Supplier. 通常来说,依赖关系不需要特殊的名字. 依赖的类别 抽象 abstraction, derive, refine, trac ...

  6. Wcf for wp8 调试Wcf服务程序(四)

    1.要以管理员身份进行登录vs2012 否则会提示: 2.在wcf 服务程序上设为启动项 3.编译 运行你的wcf服务程序 点击 就出现wcftestclient.exe 客户端调试程序 双击点击Re ...

  7. GRE学习日志

    发现开博客园真的很有督促作用,今天也顺便开个GRE学习日志吧 2015-02-09:单词 2015-02-10:单词 2015-02-11:单词 2015-03-02:阅读 2015-03-04:阅读 ...

  8. loj 1018(状压dp+记忆化搜索)

    题目链接:http://acm.hust.edu.cn/vjudge/problem/viewProblem.action?id=25844 思路:首先预处理出点在同一直线上的所有的点集状态(dp[i ...

  9. AngularJS 'Controller As'用法

    AngularJS 1.2版本中提供了Controller As语法,简单说就是可以在Controller中使用this来替代$scope,使得Controller更像一个传统的JS类,相对于$sco ...

  10. xcode命令行编译时：codesign命令，抛出“User interaction is not allowed.”异常 的处理

    之前正常运行的hudson iOS编译服务器slave节点,忽然出现编译失败.发现原因有2个: 第一个原因是编译机上用来签名的用户帐号过期,第二个原因是操作系统和xCode升级造成的. 对于第一个,重 ...