JS地址：http://ip.qq.com/js/geo.js

实例如下：

  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <title>省市区三级联动</title>
  5. <script src="http://ip.qq.com/js/geo.js" type="text/javascript" charset="gb2312"></script>
  6. <script src="http://code.jquery.com/jquery-1.12.0.min.js" type="text/javascript"></script>
  7. </head>
  8. <body>
  9.         <form>
  10.             <select class="select" name="province" id="s1">
  11.               <option></option>
  12.             </select>
  13.             <select class="select" name="city" id="s2">
  14.               <option></option>
  15.             </select>
  16.             <select class="select" name="town" id="s3">
  17.               <option></option>
  18.             </select>
  19.             <input id="address" name="address" type="hidden" value="" />
  20.             <input type="submit" value="提交" />
  21.         </form>
  22. <script>
  23.  
  24.     $(function () {
  25.         //初始化地址选择
  26.         setup();
  27.         if ($("#address").val() == "") {
  28.             preselect('四川省');
  29.             promptinfo();
  30.         }
  31.         else {
  32.             //初始化已有地址
  33.             var valArr = $("#address").val().split(",");
  34.             $("#s1").val(valArr[0]);
  35.             change(1);
  36.             $("#s2").val(valArr[1]);
  37.             change(2);
  38.             $("#s3").val(valArr[2]);
  39.         }
  40.     });
  41.     //这个函数是必须的，因为在geo.js里每次更改地址时会调用此函数
  42.     function promptinfo(){
  43.     }
  44.  
  45. </script>
  46. </body>
  47. </html>

使用腾讯IP分享计划网站中的纯JS省市区三级联动的更多相关文章

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

    在 http://ip.qq.com/ 的网站中有QQ自己的JS省市区三级联动 QQ是使用引用外部JS来实现三级联动的.JS如下:http://ip.qq.com/js/geo.js <!DOC ...

  2. php利用腾讯ip分享计划获取地理位置示例分享

    <?php function getIPLoc_QQ($queryIP){ $url = 'http://ip.qq.com/cgi-bin/searchip?searchip1='.$quer ...

  3. MVC图片上传详解 IIS (安装SSL证书后) 实现 HTTP 自动跳转到 HTTPS C#中Enum用法小结 表达式目录树 “村长”教你测试用例 引用provinces.js的三级联动

    MVC图片上传详解   MVC图片上传--控制器方法 新建一个控制器命名为File,定义一个Img方法 [HttpPost]public ActionResult Img(HttpPostedFile ...

  4. Android中使用开源框架citypickerview实现省市区三级联动选择

    1．概述 记得之前做商城项目,需要在地址选择中实现省市区三级联动,方便用户快速的填写地址,当时使用的是一个叫做android-wheel 的开源控件,当时感觉非常好用,唯一麻烦的是需要自己整理并解析省 ...

  5. 关于在smarty中实现省市区三级联动

    刚开始接触php,,其实对于一些比较深入的东西还不是很了解,就像是这次的省市区联动,都是用三张表为基础编码的,原谅我的无知,谢谢. 接下来就是编码部分了: <?php require('./sm ...

  6. 网站加载css/js/img等静态文件失败

    网站加载css/js/img等静态文件失败,报网站http服务器内部500错误.而服务器中静态文件存在且权限正常. 从浏览器中直接访问文件,出来乱码.这种问题原因在于iis中该网站mime配置报错,不 ...

  7. 在 Windows Azure 网站中配置动态 IP 地址限制

    我们最近对 Windows Azure 网站进行了升级,并启用了IIS8的动态 IP 限制模块.现在,开发人员可以为其网站启用并配置动态 IP 限制功能(或简称 DIPR). 可以通过以下链接查看此 ...

  8. 申请参加腾讯云自媒体分享计划，送代金券+CN域名

    文章介绍 看到腾讯支持博客了,就尝试下,看看效果如何. 文章属于转载,文末有文章来源,转载注明出处. 活动规则 活动资格:面向腾讯云官网已注册且完成实名认证用户,除协作者之外,其余用户均可参与; 如何 ...

  9. 在网站中添加 https 百度分享

    博客地址:http://www.moonxy.com 一.前言 百度分享是一个提供网页地址收藏.分享及发送的 WEB2.0 按钮工具,借助百度分享按钮,网站的浏览者可以方便的分享内容到人人网.开心网. ...

随机推荐

  1. URAL 2019 Pair: normal and paranormal (STL栈)

    题意:在一个半圆内,有2*n个点,其中有大写字母和小写字母.其中你需要连接大写字母到小写字母,其中需要保证这些连接的线段之间没有相交. 如果能够实现,将大写字母对应的小写字母的序号按序输出. 析:我把 ...

  2. e.key && e.which && e.keyCode

    官方推荐用e.key来描述状态码,其他两种属性可能会在未来被废弃. 且key,keyCode和which 为只读属性   但是会有浏览器兼容性的问题,可以采用如下代码:   let key = ''; ...

  3. 深入浅出HTML PDF扫描版

    <深入浅出HTML>是一部讲述现代Web标准的优秀教程,彻底摒弃了过时的内容,始终贯彻三层分离的思想.书中结合实例讲述如何使用HTML.CSS设计符合现代Web标准的网页,并讲解了如何使用 ...

  4. jquery 操作表格实例

    案例1:隔行变色,滑动,点击变色以(选中取消效果)(addClass(),removeClass(),toggleClass()) Html: <h4>1.隔行变行</h4> ...

  5. [Linux]关于sigprocmask函数的讨论

    #include <stdio.h> #include <stdlib.h> #include <string.h> #include <unistd.h&g ...

  6. Webpack 4教程 - 第八部分 使用prefetch和preload进行动态加载

    转载请注明出处:葡萄城官网,葡萄城为开发者提供专业的开发工具.解决方案和服务,赋能开发者.原文出处:https://wanago.io/2018/08/13/webpack-4-course-part ...

  7. Boost Python学习笔记（三）

    你将学到什么 在C++中调用Python代码时的传参问题 基础类型 继续使用前面的项目,但是先修改下Python脚本(zoo.py),添加Add和Str函数,分别针对整数.浮点数和字符串参数的测试 d ...

  8. 在 CentOS7 安装 ELK【转】

    ELK是一个成熟的日志系统,主要功能有收集.分析.检索,详细见 elastic官网. 本文主要介绍如何在CentOS7下安装最新版本的ELK,当然现在docker已经有完全配置成功的elk容器,安装配 ...

  9. chromedriver对应chrom版本

    chromedriver版本 支持的Chrome版本 v2.37 v64-66 v2.36 v63-65 v2.35 v62-64 v2.34 v61-63 v2.33 v60-62 v2.32 v5 ...

  10. .net core webapi框架

    折腾了一段时间..还是用ef比较熟,哈哈 参考地址:https://www.cnblogs.com/danvic712/p/10331976.html --jwt 参考地址:https://www.c ...