javascript实现仿腾讯游戏选择


Posted in Javascript onMay 14, 2015

到我们玩腾讯游戏的时候,会有很多选择,比如选择什么区,什么人物等。下面简单制作腾讯游戏选择。

javascript实现仿腾讯游戏选择

javascript实现仿腾讯游戏选择

javascript实现仿腾讯游戏选择

<!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>请选择游戏类别:<select id="lei" onChange="ck()" >
 <option>--游戏分类--</option>
 </select></p>
  <p>请选择游戏名称:<select id="youxi">
 <option>--游戏名称--</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");
 //创建省市数组
 var List=new Array();
   List['纸牌游戏'] = ['斗地主','拖拉机','桥牌','拱猪','打百分'];
   List['棋类游戏'] = ['围棋','象棋','跳棋','西瓜棋','五子棋'];
   List['其他游戏'] = ['枪林弹雨','跑跑卡丁车','英雄联盟','CF','英雄三国'];
   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>

以上所述就是本文的全部内容了,希望大家能够喜欢。

Javascript 相关文章推荐
javascript事件模型代码
Jul 01 Javascript
基于jQuery的弹出框插件
Mar 18 Javascript
Jquery获取和修改img的src值的方法
Feb 17 Javascript
jQuery超精致图片轮播幻灯片特效代码分享
Sep 10 Javascript
js实现图片淡入淡出切换简易效果
Aug 22 Javascript
详解require.js配置路径的用法和css的引入
Sep 06 Javascript
JS实现简单的浮动碰撞效果示例
Dec 28 Javascript
vue 路由页面之间实现用手指进行滑动的方法
Feb 23 Javascript
Vue 实现拖动滑块验证功能(只有css+js没有后台验证步骤)
Aug 24 Javascript
JS监听滚动和id自动定位滚动
Dec 18 Javascript
JavaScript学习教程之cookie与webstorage
Jun 23 Javascript
Js Snowflake(雪花算法)生成随机ID的实现方法
Aug 26 Javascript
JavaScript实现Flash炫光波动特效
May 14 #Javascript
javascript基于DOM实现省市级联下拉框的方法
May 14 #Javascript
javascript搜索框效果实现方法
May 14 #Javascript
javascript操作ul中li的方法
May 14 #Javascript
javascript中createElement的两种创建方式
May 14 #Javascript
javascript常用方法总结
May 14 #Javascript
javascript实现动态改变层大小的方法
May 14 #Javascript
You might like
PHP 循环删除无限分类子节点的实现代码
2013/06/21 PHP
Drupal7连接多个数据库及常见问题解决
2014/03/02 PHP
PHP6连接SQLServer2005的三部曲
2016/04/15 PHP
CI框架AR数据库操作常用函数总结
2016/11/21 PHP
php/JS实现的生成随机密码(验证码)功能示例
2019/06/06 PHP
Ext对基本类型的扩展 ext,extjs,format
2010/12/25 Javascript
JS 精确统计网站访问量的实例代码
2013/07/05 Javascript
浅谈重写window对象的方法
2014/12/29 Javascript
js窗口关闭提示信息(兼容IE和firefox)
2015/10/23 Javascript
浅谈Sticky组件的改进实现
2016/03/22 Javascript
Vue开发过程中遇到的疑惑知识点总结
2017/01/20 Javascript
vue动态组件实现选项卡切换效果
2017/03/08 Javascript
js oncontextmenu事件使用详解
2017/03/25 Javascript
Vue组件之自定义事件的功能图解
2018/02/01 Javascript
详解vue 项目白屏解决方案
2018/10/31 Javascript
vue-cli2.0转3.0之项目搭建的详细步骤
2018/12/11 Javascript
解决layer.open弹出框不能获取input框的值为空的问题
2019/09/10 Javascript
vue自定义指令实现仅支持输入数字和浮点型的示例
2019/10/30 Javascript
Node快速切换版本、版本回退(降级)、版本更新(升级)
2021/01/07 Javascript
python实现文件分组复制到不同目录的例子
2014/06/04 Python
python调用短信猫控件实现发短信功能实例
2014/07/04 Python
手动实现把python项目发布为exe可执行程序过程分享
2014/10/23 Python
python实现爬虫下载美女图片
2015/07/14 Python
Python 判断是否为质数或素数的实例
2017/10/30 Python
使用 Python 实现文件递归遍历的三种方式
2018/07/18 Python
Python+Pandas 获取数据库并加入DataFrame的实例
2018/07/25 Python
Python定义一个函数的方法
2020/06/15 Python
Python可视化工具如何实现动态图表
2020/10/23 Python
python动态规划算法实例详解
2020/11/22 Python
意大利消费电子产品购物网站:SLG Store
2019/12/26 全球购物
有关爱国演讲稿
2014/05/07 职场文书
不服从上级领导安排的检讨书
2014/09/14 职场文书
委托书的写法
2014/09/16 职场文书
师范生见习总结范文
2015/06/23 职场文书
2015年四年级班主任工作总结
2015/10/22 职场文书
分析SQL窗口函数之排名窗口函数
2022/04/21 Oracle