<head>

    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />

    <title>面向对象</title>

    <meta name="keywords" content="关键字列表" />

    <meta name="description" content="网页描述" />

    <link rel="stylesheet" type="text/css" href="" />

    <script>

        //定义省得相关信息

        var sheng=['请选择','广东省','湖南省','湖北省'];

        //定义是的相关信息

        var shi = [[],['广州市','东莞市','珠海市'],['长沙市','株洲市','湘潭市'],['武汉市','宜昌市','荆门市']];

        //封装一个DOM对象

        function $(id){

            return document.getElementById(id);

        }

        function createSheng(){

        //遍历一维数组

            for(var i in sheng){

            //定义op对象

                var op=new Option(sheng[i],i);

                //追加元素到下拉列表

                $('sheng').options.add(op);

            }

        }

        function createShi(){

        //获取省得索引信息

            var index=$('sheng').selectedIndex;

            //清除市的下拉选框

            $('shi').length=0;

            //遍历市的相关信息

            for(var i in shi[index]){

                var op =new Option(shi[index][i],i);

                //追加元素

                $('shi').options.add(op);

            }

        }

        //定义一个window.onload事件

        window.onload=function(){

            createSheng();

            //触发事件

            $('sheng').onchange=createShi;

        }

    </script>

</head>

<body>

    <select id='sheng'></select>

    <select id='shi'></select>

</body>

</html>

javascript实现的功能--二级联动的更多相关文章

  1. JavaScript+Json写的二级联动

    省市区的联动,相当常见 我就不写这么大数据的了,先写个简单的试一试 <!DOCTYPE html> <html> <head> <title></ ...

  2. 利用Ajax和JSON实现关于查找省市名称的二级联动功能

    功能实现的思路:我们经常碰见网上购物时候填写收件地址会用到这个查找省市县的三级联动查找功能,我们可以利用Ajax和JSON技术模拟这个功能,说白了同样是使用Ajax的局部数据更新功能这个特性.因为省市 ...

  3. JavaScript日历控件开发 C# 读取 appconfig文件配置数据库连接字符串，和配置文件 List<T>.ForEach 调用异步方法的意外 ef 增加或者更新的习惯思维 asp.net core导入excel 一个二级联动

    JavaScript日历控件开发   概述 在开篇之前,先附上日历的代码地址和演示地址,代码是本文要分析的代码,演示效果是本文要实现的效果代码地址:https://github.com/aspwebc ...

  4. 利用JavaScript来实现省份—市县的二级联动

    所谓省-市二级联动是指当选择省份下拉选择框时,市县的下拉框会根据选择的省市而有相应的市县加载出来,如下图所示选择"上海市",城市的下拉选择框只会出现上海的市县: 这种二级联动非常常 ...

  5. javascript二级联动

    二级联动在一般的网页中随处可见,一般是地址,比如点击浙江省,随后出现的是杭州市,嘉兴市:点击北京省出现的是朝阳,海淀,而不是出现杭州,嘉兴. 要想实现这个步骤,就要用到javascript来实现.其中 ...

  6. JavaScript 实现省市二级联动

    JavaScript 实现省市二级联动 版权声明:未经授权,严禁转载! 案例代码 <style> .hide { display: none; } </style> <s ...

  7. Javascript中二级联动

    主要使用到到了地址JSON格式,来做,没有涉及数据库的读取. <!DOCTYPE html><html><head> <meta charset=" ...

  8. 二级联动，三级联动，初学者，纯javascript，不含jQuery

    二级联动: html代码: <body> <select id="province" onchange="getCity(this.options.se ...

  9. 关于EasyUI查询功能的二级联动

    EasyUI 二级联动 data-options="multiple:true" 属性可实现对于车牌号的多选.

随机推荐

  1. [基础]RHEL6下iSCSI客户端挂载配置

    本文根据鸟哥私房菜进行操作:http://linux.vbird.org/linux_enterprise/xen.php?thisscreen=800x600 一.侦测 [root@vhost3 ~ ...

  2. openvswitch安装、基本操作

    一.安装,配置 //下载源码.编译.安装: #wget http://openvswitch.org/releases/openvswitch-2.3.0.tar.gz #tar -zxvf open ...

  3. How To Set Dark Theme in Visual Studio 2010

    Want to use the visual studio color theme editor to set the dark theme or other themes? Below shows ...

  4. HTML系列（九）：表单

    一.表单标签form 表单标签用于申明表单,定义采集数据的范围,即<form>包含的数据将被提交到数据库上,包含了处理表单数据所用CGI程序的URL以及数据提交到服务器的方法. 表单能够包 ...

  5. 虚拟键盘，移动web开发的痛

    原生APP的弹出虚拟键盘和收回虚拟键盘,输入框始终贴在虚拟键盘的上方.如下图: 如果移动端web也想做类似的功能,可以实现吗?  你可能会说着:“不就是放一个position: fixed;的输入框在 ...

  6. C#文件压缩

    /// <summary> /// 文件压缩 /// </summary> /// <param name="filesUrl">多个文件路径& ...

  7. 使用MyBatis搭建一个访问mysql数据库的简单示例

    MyBatis是一个支持普通SQL查询,存储过程和高级映射的优秀持久层框架.MyBatis消除了几乎所有的JDBC代码和参数的手工设置以及对结果集的检索封装.MyBatis可以使用简单的XML或注解用 ...

  8. C# 第三方控件 错误 LC-1

    删掉项目下面的Properties\licenses.licx 文件

  9. 【转载】谈谈Cookie

    0×00 引言 在Web技术的发展史上,Cookie技术的出现是一次重大的 变革.但是, Cookie技术又是一项非常有争议的技术,从它诞生之日起就成了广大网络用户和Web开发人员的一个争论焦点,原因 ...

  10. BZOJ 1146: [CTSC2008]网络管理Network( 树链剖分 + 树状数组套主席树 )

    树链剖分完就成了一道主席树裸题了, 每次树链剖分找出相应区间然后用BIT+(可持久化)权值线段树就可以完成计数. 但是空间问题很严重....在修改时不必要的就不要新建, 直接修改原来的..详见代码. ...