zoukankan      html  css  js  c++  java
  • 省市县联动(转)

    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <title></title>
        <script type="text/javascript">
        
    //示例数据,数据的不同,获取数据的方法是不同的
          var data = { "浙江省": { "湖州市": ["德清县","长兴县","安吉县","吴兴区","南浔区"], "杭州市": ["上城区""下城区""西湖区"] },
                       
    "河南省": {"洛阳市":["孟津县","新安县","栾川县"],"新乡市":["新乡县","获嘉县","长垣县","封丘县"],"周口市":["鹿邑县","太康县","郸城县","淮阳县"]},
                       
    "北京市": {"北京市":["昌平区","海淀区","怀柔县","延庆县"]}
                          };

        window.onload 
    = function () {
          
    //填充省数据
          for (p in data) {
            
    var sheng = document.getElementById("province");
            sheng.options[sheng.options.length] 
    = new Option(p, p);
          }
          setCity()
        }

        
    function setCity()
        {
          
    var sheng = document.getElementById("province");
          
    var shi = document.getElementById("city");
          shi.options.length 
    = 0;
          
    var selected_sheng = sheng.options[sheng.selectedIndex].value;
          
    for (c in data[selected_sheng]) {
            
            shi.options[shi.options.length] 
    = new Option(c, c);
          }
          setCountry()
        }
        
    function setCountry() {
          
    var sheng = document.getElementById("province");
          
    var shi = document.getElementById("city");
          
    var xian = document.getElementById("country");
          
    var selected_sheng = sheng.options[sheng.selectedIndex].value;
          
    var selected_shi = shi.options[shi.selectedIndex].value;
          
    var xianArray = data[selected_sheng][selected_shi];
          xian.options.length 
    = 0;
          
    for (i = 0; i < xianArray.length;i++ ) {
            xian.options[xian.options.length] 
    = new Option(xianArray[i], xianArray[i]);
          }
        }
        
    </script>
    </head>
    <body>
        <form>
        选择省:<select id="province" onchange="setCity()"></select>
        选择市:<select id="city" onchange="setCountry()"></select>
        选择区县:<select id="country"></select>
        </form>
    </body>
    </html>
  • 相关阅读:
    DBCA创建数据库ORA-01034 ORACLE not available
    Linux shell 内部变量
    ext4文件系统制作
    curses-键盘编码-openssl加解密【转】
    Linux 中的键盘映射【转】
    C 语言 字符串命令 strstr()的用法 实现将原字符串以分割串分割输出【转】
    Linux下使用popen()执行shell命令【转】
    linux下获取按键响应事件【转】
    linux select函数:Linux下select函数的使用详解【转】
    OTA升级中关于update.zip包的一些总结【转】
  • 原文地址:https://www.cnblogs.com/Fskjb/p/2498520.html
Copyright © 2011-2022 走看看