從QQ網(wǎng)站中提取的純JS省市區(qū)三級(jí)聯(lián)動(dòng)菜單

何不直接使用的數(shù)據(jù)呢?
驚喜的是QQ是使用引用外部JS來實(shí)現(xiàn)三級(jí)聯(lián)動(dòng)的。JS如下:http://ip.qq.com/js/geo.js
使用方法如下:
<!DOCTYPE html>
<html>
<head>
<title>QQ JS省市區(qū)三級(jí)聯(lián)動(dòng)</title>
<!-- 直接使用QQ的省市區(qū)數(shù)據(jù) -->
<!--
<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>
//這個(gè)函數(shù)是必須的,因?yàn)樵趃eo.js里每次更改地址時(shí)會(huì)調(diào)用此函數(shù)
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>
- PHP+Mysql+Ajax+JS實(shí)現(xiàn)省市區(qū)三級(jí)聯(lián)動(dòng)
- javascript實(shí)現(xiàn)省市區(qū)三級(jí)聯(lián)動(dòng)下拉框菜單
- 省市區(qū)三級(jí)聯(lián)動(dòng)下拉框菜單javascript版
- js實(shí)現(xiàn)一個(gè)省市區(qū)三級(jí)聯(lián)動(dòng)選擇框代碼分享
- JSON+Jquery省市區(qū)三級(jí)聯(lián)動(dòng)
- 原生js實(shí)現(xiàn)省市區(qū)三級(jí)聯(lián)動(dòng)代碼分享
- vue.js模仿京東省市區(qū)三級(jí)聯(lián)動(dòng)的選擇組件實(shí)例代碼
- javascript實(shí)現(xiàn)簡單的省市區(qū)三級(jí)聯(lián)動(dòng)
- javascript省市區(qū)三級(jí)聯(lián)動(dòng)下拉框菜單實(shí)例演示
- js實(shí)現(xiàn)省市區(qū)三級(jí)聯(lián)動(dòng)非select下拉框版
相關(guān)文章
Element-UI的?InfiniteScroll?無限滾動(dòng)組件基本使用及應(yīng)用場(chǎng)景
這篇文章主要介紹了Element-UI的InfiniteScroll無限滾動(dòng)組件基本使用,本文通過實(shí)例代碼給大家介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2023-06-06uniapp實(shí)現(xiàn)app自動(dòng)更新詳細(xì)步驟
這篇文章主要給大家介紹了關(guān)于uniapp實(shí)現(xiàn)app自動(dòng)更新的詳細(xì)步驟,文中給出了詳細(xì)的代碼示例以及圖文教程,對(duì)大家學(xué)習(xí)或者使用uniapp具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下2023-08-08JavaScript實(shí)現(xiàn)跟隨鼠標(biāo)移動(dòng)的盒子
這篇文章主要為大家詳細(xì)介紹了JavaScript實(shí)現(xiàn)跟隨鼠標(biāo)移動(dòng)的盒子,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2021-01-01微信小程序中如何使用flyio封裝網(wǎng)絡(luò)請(qǐng)求
這篇文章主要介紹了微信小程序中如何使用flyio封裝網(wǎng)絡(luò)請(qǐng)求,F(xiàn)ly.js 通過在不同 JavaScript 運(yùn)行時(shí)通過在底層切換不同的 Http Engine來實(shí)現(xiàn)多環(huán)境支持,但同時(shí)對(duì)用戶層提供統(tǒng)一、標(biāo)準(zhǔn)的Promise API,需要的朋友可以參考下2019-07-07動(dòng)態(tài)生成的IFRAME,設(shè)置SRC時(shí)的問題解決分析
動(dòng)態(tài)生成的IFRAME,設(shè)置SRC時(shí)的,不同位置帶來的影響。 以下所說的是在IE7下運(yùn)行的。IE6下也是同樣。 在這個(gè)blog中,直接點(diǎn)擊運(yùn)行代碼,和把下面代碼保存到為網(wǎng)頁在運(yùn)行(以本地文件或域名訪問),效果不一樣。 先看例子:2008-04-04關(guān)于BootstrapTable 導(dǎo)出數(shù)據(jù)的問題最終解決方案
這篇文章主要介紹了BootstrapTable 導(dǎo)出數(shù)據(jù)的問題,本文通過實(shí)例代碼給大家介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2022-03-03bootstrap paginator分頁前后臺(tái)用法示例
這篇文章主要為大家詳細(xì)介紹了bootstrap paginator分頁前后臺(tái)用法示例,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2017-06-06