手机
当前位置:查字典教程网 >编程开发 >Javascript教程 >从QQ网站中提取的纯JS省市区三级联动菜单
从QQ网站中提取的纯JS省市区三级联动菜单
摘要:我发现在http://ip.qq.com/的网站中有QQ自己的JS省市区三级联动。所以研究了一下。他的界面如下:何不直接使用的数据呢?惊喜的...

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

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

何不直接使用的数据呢?

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

使用方法如下:

复制代码 代码如下:

<!DOCTYPE html>

<html>

<head>

<title>QQ JS省市区三级联动</title>

<>

<>

<script type="text/javascript" src="geo.js"></script>

</head>

<body onload="setup();preselect('陕西省');promptinfo();">

<form>

<select name="province" id="s1">

<option></option>

</select>

<select name="city" id="s2">

<option></option>

</select>

<select name="town" id="s3">

<option></option>

</select>

<input id="address" name="address" type="hidden" value="" />

<input 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>

【从QQ网站中提取的纯JS省市区三级联动菜单】相关文章:

JS与Java在网页设计中的区别

js实现精美的银灰色竖排折叠菜单

快速掌握Node.js环境的安装与运行方法

初步使用Node连接Mysql数据库

什么是Node.js?

js+html5操作sqlite数据库的方法

JavaScript中的parse()方法使用简介

jQuery+ajax实现无刷新级联菜单示例

javascript获取select值的方法分析

javascript实现简单的省市区三级联动

精品推荐
分类导航