我发现在 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>
您可能感兴趣的文章:
- JS实多级联动下拉菜单类，简单实现省市区联动菜单！
- JS简单实现多级Select联动菜单效果代码
- 基于Javascript实现二级联动菜单效果
- JS实现的五级联动菜单效果完整实例
- PHP+JS三级菜单联动菜单实现方法
- javascript实现无限级select联动菜单
- js 实现省市区三级联动菜单效果
- javascript读取Xml文件做一个二级联动菜单示例
- 琥珀无限级联动菜单-JavaScript版
- JavaScript省市区三级联动菜单效果
- javascript 无限联动菜单效果代码
- JavaScript实现的联动菜单特效示例
![[C#]使用 C# 代码实现拓扑排序 dotNet Core WEB程序使用 Nginx反向代理 C#里面获得应用程序的当前路径 关于Nginx设置端口号，在Asp.net 获取不到的，解决办法 .Net程序员 初学Ubuntu ，配置Nignix 夜深了，写了个JQuery的省市区三级级联效果](https://www.kunjuke.com/file/css/thumb/8.jpg/280-180.jpg)
