联动菜单:

<!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. Oracle Undo与脏读解析

    Undo就是用来记录保存事务操作过程中的数据,如果事务发生错误,可以之前的数据进行填补. Undo segment 是保存在表空间上的.Undo 大小是固定的,既然是固定的也就是有限的.如果保存的记录 ...

  2. 烟大 Contest1024 - 《挑战编程》第一章:入门 Problem C: The Trip(水题)

    Problem C: The Trip Time Limit: 1 Sec  Memory Limit: 64 MBSubmit: 19  Solved: 3[Submit][Status][Web ...

  3. php 解决和避免form表单重复提交的方法

    在提交表单的时候,可能遇到网速等导致页面突然加载变慢,用户重复地点击提交按钮,将在数据库产生多条数据,导致不可控情况. 比如下面的情况就会导致表单重复提交: 点击提交按钮两次. 点击刷新按钮. 使用浏 ...

  4. ERStudio的使用

    转自于:http://www.cnblogs.com/TangPro/p/3250320.html 打开ERstudio,点击新建出现如图对话框: 选择第一个,表示创建一个新的关系型 数据库模型 这里 ...

  5. Android的onCreateOptionsMenu()创建菜单Menu详解(转)

    Android一共有三种形式的菜单:            1.选项菜单(optinosMenu)            2.上下文菜单(ContextMenu)            3.子菜单(s ...

  6. 内容提供者Content Provider

    *读取联系人 StringBuilder sb = new StringBuilder(); // 1:得到中间人. ContentResolver resolver = getContentReso ...

  7. pigcms 标签读不出

    错误:{pigcms:jc['portrait']} 正确:{pigcms:$jc['portrait']}

  8. Android 编程下 Using ViewPager for Screen Slides

    (参考官方文档:Using ViewPager for Screen Slides | Android Developers)

  9. DP ZOJ 3735 Josephina and RPG

    题目传送门 题意:告诉你C(m,3)个队伍相互之间的胜率,然后要你依次对战n个AI队伍,首先任选一种队伍,然后战胜一个AI后可以选择替换成AI的队伍,也可以不换,问你最后最大的胜率是多少. 分析:dp ...

  10. POJ3659 Cell Phone Network(树上最小支配集:树型DP)

    题目求一棵树的最小支配数. 支配集,即把图的点分成两个集合,所有非支配集内的点都和支配集内的某一点相邻. 听说即使是二分图,最小支配集的求解也是还没多项式算法的.而树上求最小支配集树型DP就OK了. ...