zoukankan      html  css  js  c++  java
  • 从QQ网站中提取的纯JS省市区三级联动

    今天收到园友信息,想问我要原来写的一个 《 纯JS省市区三级联动 》文章中最新的省市区数据。

    那个是老早以前搞的。记得数据是从数据库中提取生成的。一时也找不到当时的数据库了。

    我发现在 http://ip.qq.com/ 的网站中有QQ自己的JS省市区三级联动。所以研究了一下。他的界面如下:

    何不直接使用的数据呢?

    惊喜的是QQ是使用引用外部JS来实现三级联动的。JS如下:http://ip.qq.com/js/geo.js

    使用方法如下:

    <!DOCTYPE html>
    <html>
    <head>
    <title>QQ JS省市区三级联动</title>
    <!-- 直接使用QQ的省市区数据 -->
    <!--
    <script type="text/javascript" src="http://ip.qq.com/js/geo.js"></script>
    -->
    <script type="text/javascript" src="geo.js"></script>
    </head>
    <body onload="setup();preselect('陕西省');promptinfo();">
            <form>
                <select class="select" name="province" id="s1">
                  <option></option>
                </select>
                <select class="select" name="city" id="s2">
                  <option></option>
                </select>
                <select class="select" name="town" id="s3">
                  <option></option>
                </select>
                <input id="address" name="address" type="hidden" value="" />
              <input onclick="alert(document.getElementById('address').value); return false;" type="submit" value="提交" />
            </form>
    <script>
    
    //这个函数是必须的,因为在geo.js里每次更改地址时会调用此函数
    function promptinfo()
    {
        var address = document.getElementById('address');
        var s1 = document.getElementById('s1');
        var s2 = document.getElementById('s2');
        var s3 = document.getElementById('s3');
        address.value = s1.value + s2.value + s3.value;
    }
    
    </script>
    </body>
    </html>

    实例下载:http://files.cnblogs.com/zjfree/qqJsAddress.rar

  • 相关阅读:
    汇编之EBP的认识。
    【转】PE详解
    迟到的,2016年终总结
    Java 反射
    Java 集合与容器类
    Java 类加载与实例化
    Java 类与对象
    Java 值传递与对象拷贝
    Java 面向对象
    二叉树
  • 原文地址:https://www.cnblogs.com/zjfree/p/3269864.html
Copyright © 2011-2022 走看看