JScript实现地址选择功能

 更新时间:2017年08月15日 08:54:53   作者:顾白的顾小白  
这篇文章主要为大家详细介绍了JScript实现地址选择功能,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

本文实例为大家分享了JScript实现地址选择功能的具体代码,供大家参考,具体内容如下

<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <title></title>
    <script>
      var shenArr = new Array(5);
      shenArr["广东"] = ["广州","深圳","韶关","汕头","茂名"];
      shenArr["湖南"] = ["长沙","张家界","株洲","岳阳","吉首"];
      shenArr["湖北"] = ["武汉","宜昌","荆州","黄冈","仙桃"];
      shenArr["安徽"] = ["合肥","黄山"];
      shenArr["河南"] = ["郑州","开封","洛阳","信阳"];
       function getShen(){
        var s = document.getElementById("shen");
        for(var v in shenArr){
          //把数组键加入到省的下拉框
          s.add(new Option(v,v),null);
        }
       }

      function getCity(){
        var s = document.getElementById("shen");
        var c = document.getElementById("city");
        var v = s.value;//省份的名称,也是数组中的键
        c.options.length = 0;//把城市下拉框中的项清除

        //循环把某一个省的城市加入到市的下拉框
        for(var i in shenArr[v] ){
          c.add(new Option(shenArr[v][i],shenArr[v][i]),null);
        }

      }

    </script>
  </head>
  <body onload="getShen()">
    省:<select id="shen" onchange="getCity()">
      <option value="0">--请选择--</option>
    </select>
    市:<select id="city"></select>
  </body>
</html>

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持脚本之家。

相关文章

  • JS中Select下拉列表类(支持输入模糊查询)功能

    JS中Select下拉列表类(支持输入模糊查询)功能

    这篇文章主要介绍了JS中Select下拉列表类(支持输入模糊查询)功能,代码简单易懂,非常不错,具有参考借鉴价值,需要的朋友参考下吧
    2017-01-01
  • 微信小程序通过点击事件传参(data-)的操作示例

    微信小程序通过点击事件传参(data-)的操作示例

    微信小程序可以通过直接写 data-index="1" 进行数据的绑定 ,利用 bindtap 点击事件执行函数从而获取到参数信息,本文给大家介绍微信小程序通过点击事件传参(data-)的操作,感兴趣的朋友一起看看吧
    2023-12-12
  • 如何让easyui gridview 宽度自适应窗口改变及fitColumns应用

    如何让easyui gridview 宽度自适应窗口改变及fitColumns应用

    在使用Easyui GridView时,如果要Gridview的宽度和窗口的宽度相同,只需要设置fitColumns: true即可,感兴趣的你不要走开啊,接下来为您详细介绍
    2013-01-01
  • js仿黑客帝国字母掉落效果代码分享

    js仿黑客帝国字母掉落效果代码分享

    这篇文章主要展示了js仿黑客帝国字母掉落效果,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2015-08-08
  • JavaScript中null和undefined的区别详解

    JavaScript中null和undefined的区别详解

    null 是一个原始值,表示“无”或“空值”,它通常用于指示变量应有的对象或值不存在,undefined 是一个原始值,表示“未定义”,本文给大家详细介绍了JavaScript中null和undefined的区别,需要的朋友可以参考下
    2024-10-10
  • 使用JavaScript实现一个简单的哈希映射功能

    使用JavaScript实现一个简单的哈希映射功能

    哈希表大家应该都经常用到吧,那么大家有没有想过哈希表是怎么实现的呢,本文我们就来从一道简单的题目来了解一下哈希表的简单原理和实现吧
    2024-02-02
  • 原生JS实现轮播图效果

    原生JS实现轮播图效果

    这篇文章主要为大家详细介绍了原生JS实现轮播图效果,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2018-10-10
  • 对layui中表单元素的使用详解

    对layui中表单元素的使用详解

    今天小编就为大家分享一篇对layui中表单元素的使用详解。具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2018-08-08
  • JS实现表格数据各种搜索功能的方法

    JS实现表格数据各种搜索功能的方法

    这篇文章主要介绍了JS实现表格数据各种搜索功能的方法,可实现忽略大小写,模糊搜索,多关键搜索等功能,具有一定参考借鉴价值,需要的朋友可以参考下
    2015-03-03
  • js正则表达式中test,exec,match方法的区别说明

    js正则表达式中test,exec,match方法的区别说明

    本篇文章主要是对js正则表达式中test,exec,match方法的区别进行了介绍,需要的朋友可以过来参考下,希望对大家有所帮助
    2014-01-01

最新评论