联动菜单:

<!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. sina发现并不会去导入qq使用的

    看问题需要多角度,为之不能实现也是有可能没有完善的.确实是由于短时间发布过多,还是bky好点好像有30S

  2. 查看CPU是否支持虚拟化

    参考:http://www.cnblogs.com/jankie/archive/2012/07/04/2575695.html 一.Windows平台:使用cpu-Z即可查看. 二.Linux平台: ...

  3. Effective C++笔记:设计与声明

    条款18:让接口容易被正确使用,不易被误用 1,好的接口很容易被正确使用,不容易被误用.你应该在你的所有接口中努力达成这些性质. 2,“促进正使用”的办法包括接口的一致性,以及与内置类型的行为兼容. ...

  4. 写好的mapreduce程序,编译,打包,得到最后的jar包! 验证jar包 ! 整体流程

    创建一个bin目录,用于存放编译.java文件产生的.class等结果,然后编译! 编译结果! 打包操作! 打包结果! 验证打包生成的jar包,是否正常,验证成功!!!!!!!!!!!! 结果正确!! ...

  5. Winedt打开tex文件报错error reading的解决方案

    我刚装就发现winedt打开一些.tex文件时会出现reading error,然后看不到任何文字(网上有人讨论打开是乱码的问题,但是我的是完全看不到任何东西),我的系统winxp,网上有人说好像是和 ...

  6. vim 全局替换命令

    语法  :[addr]s/源字符串/目的字符串/[option]                     :%s/源字符串/目的字符串/c 全局替换命令为: :%s/源字符串/目的字符串/g [add ...

  7. C#可以做什么

    C#可以做什么 学以致用.这也是大家学习C#的目标.当我们充分了解C#广阔的应用,才会激发我们最大的学习热情.下面将介绍一下C#的常见应用场景本文选自明明白白学C#大学霸. 0.2.1  开发普通软件 ...

  8. DataTable转换成List<T>

    很多时候需要将DataTable转换成一组model,直接对model执行操作会更加方便直观. 代码如下: public static class DataTableToModel { public ...

  9. 10分钟API Hook MessageBox

    10分钟API Hook MessageBox 分类: C++2012-04-12 22:52 877人阅读 评论(4) 收藏 举报 hookwinapidllthreadpython编程 转载注明出 ...

  10. 简单几何(线段相交) POJ 2826 An Easy Problem?!

    题目传送门 题意:两条线段看成两块木板,雨水从上方往下垂直落下,问能接受到的水的体积 分析:恶心的分类讨论题,考虑各种情况,尤其是入口被堵住的情况,我的方法是先判断最高的两个点是否在交点的同一侧,然后 ...