javascript實(shí)現(xiàn)仿騰訊游戲選擇
更新時(shí)間：2015年05月14日 10:34:40 投稿：hebedich
這篇文章主要介紹了javascript實(shí)現(xiàn)仿騰訊游戲選擇，簡(jiǎn)單實(shí)現(xiàn)的下拉菜單二級(jí)聯(lián)動(dòng)效果，十分不錯(cuò)，有需要的小伙伴可以參考下。
到我們玩騰訊游戲的時(shí)候，會(huì)有很多選擇，比如選擇什么區(qū)，什么人物等。下面簡(jiǎn)單制作騰訊游戲選擇。
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="Generator" content="EditPlus®">
<meta name="Author" content="">
<meta name="Keywords" content="">
<meta name="Description" content="">
<title>紙牌游戲</title>
<style type="text/css">
#div{width:450px;height:134px;border:1px solid #fff}
</style>
</head>
<body>
<center>
<div id="div">
<img src="images/banner.jpg" width="450" height="134" border="0" alt="">
</div>
<div style="width:450px;height:134px;border:1px solid #fff;background:#1C85B4">
<p>請(qǐng)選擇游戲類(lèi)別:<select id="lei" onChange="ck()" >
<option>--游戲分類(lèi)--</option>
</select></p>
<p>請(qǐng)選擇游戲名稱(chēng):<select id="youxi">
<option>--游戲名稱(chēng)--</option>
</select></p>
<p><input name="" type="image" src="images/login.gif" /></p>
</div>
</body>
<script type="text/javascript">
var lei= document.getElementById("lei");
var youxi= document.getElementById("youxi");
//創(chuàng)建省市數(shù)組
var List=new Array();
List['紙牌游戲'] = ['斗地主','拖拉機(jī)','橋牌','拱豬','打百分'];
List['棋類(lèi)游戲'] = ['圍棋','象棋','跳棋','西瓜棋','五子棋'];
List['其他游戲'] = ['槍林彈雨','跑跑卡丁車(chē)','英雄聯(lián)盟','CF','英雄三國(guó)'];
for(var i in List){
lei.add(new Option(i,i),null);
}
lei.onchange=function(){
var lei= document.getElementById("lei").value;
var youxi= document.getElementById("youxi");
youxi.options.length=0;
for(var k in List[lei]){
youxi.add(new Option(List[lei][k],List[lei][k]),null);
}
}
</script>
</html>
以上所述就是本文的全部?jī)?nèi)容了，希望大家能夠喜歡。
相關(guān)文章
js中根據(jù)字?jǐn)?shù)截取字符串，不能截?cái)鄒rl
給一個(gè)文字，對(duì)輸出的文字進(jìn)行截取，保留400個(gè)字符,其中對(duì)url的保留比較麻煩，尤其是有兩個(gè)相同url時(shí)不能采用indexOf獲取其字符位置2012-01-01
FireFox中textNode分片的問(wèn)題...2007-04-04
uniapp開(kāi)發(fā)微信小程序自定義頂部導(dǎo)航欄功能實(shí)例
uni-app是一個(gè)使用Vue.js開(kāi)發(fā)跨平臺(tái)應(yīng)用的前端框架,下面這篇文章主要給大家介紹了關(guān)于uniapp開(kāi)發(fā)微信小程序自定義頂部導(dǎo)航欄功能的相關(guān)資料,文中通過(guò)圖文以及示例代碼介紹的非常詳細(xì),需要的朋友可以參考下2022-08-08
js與jQuery實(shí)現(xiàn)checkbox復(fù)選框全選/全不選的方法
這篇文章主要介紹了js與jQuery實(shí)現(xiàn)checkbox復(fù)選框全選/全不選的方法,結(jié)合實(shí)例較為詳細(xì)的分析了JavaScript與jQuery針對(duì)checkbox復(fù)選框全選與反選的操作技巧,需要的朋友可以參考下2016-01-01
js 實(shí)現(xiàn)獲取name 相同的頁(yè)面元素并循環(huán)遍歷的方法
下面小編就為大家?guī)?lái)一篇js 實(shí)現(xiàn)獲取name 相同的頁(yè)面元素并循環(huán)遍歷的方法。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2017-02-02
完美解決JS文件頁(yè)面加載時(shí)的阻塞問(wèn)題
下面小編就為大家?guī)?lái)一篇完美解決JS文件頁(yè)面加載時(shí)的阻塞問(wèn)題。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2016-12-12
激活 ActiveX 控件...2006-10-10
微信小程序?qū)崿F(xiàn)人臉識(shí)別登陸的示例代碼
這篇文章主要介紹了微信小程序?qū)崿F(xiàn)人臉識(shí)別登陸的示例代碼，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2019-04-04
Javascript 個(gè)人筆記（沒(méi)有整理，很亂）
Javascript 個(gè)人筆記（沒(méi)有整理，很亂）...2007-07-07
通過(guò)js控制時(shí)間,一秒一秒自己動(dòng)的實(shí)例
下面小編就為大家?guī)?lái)一篇通過(guò)js控制時(shí)間,一秒一秒自己動(dòng)的實(shí)例。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2017-10-10