从QQ网站中提取的纯JS省市区三级联动

Posted on 2013-08-20 11:36 PHP-张工阅读(27918) 评论(30) 编辑收藏举报

今天收到园友信息，想问我要原来写的一个《纯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>

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

刷新页面返回顶部

登录后才能查看或发表评论，立即登录或者逛逛博客园首页

阅读排行：
· 全程不用写代码，我用AI程序员写了一个飞机大战
· DeepSeek 开源周回顾「GitHub 热点速览」
· 记一次.NET内存居高不下排查解决与启示
· 物流快递公司核心技术能力-地址解析分单基础技术分享
· .NET 10首个预览版发布：重大改进与新特性概览！

ZjFree-自由自在

公告

搜索

最新随笔

积分与排名

随笔分类 (385)

阅读排行榜

推荐排行榜

从QQ网站中提取的纯JS省市区三级联动