jQuery 写的简单打字游戏

var off_x;   //横坐标var count=0;   //总分var speed=5000;  //速度,默认是5秒.var keyErro=0;   //输入错误次数var keyRight=0;   //输入正确的次数//组织字母var charArray=new Array("A", "B", "C", "D", "E", "F", "G", "H", "I", "J", "K", "L", "M", "N", "O", "P", "Q", "R", "S", "T", "U", "V", "W", "X", "Y", "Z");//按键码数组var arrCode=new Array();for(var i=65;i<=90;i++){arrCode[i-65]=i;}//随机生产一个字母var randomChar=function(){off_x=Math.random()*500+5;    //在div横坐标//off_y=Math.random()*500-10;     //在div纵坐标var c=charArray[parseInt(Math.random()*25)];  //随机生成一个字母var charHtml="  <div class='char' id='"+c+"' style='left: "+off_x+"px;color:"+colorBox()+"'>"+c+"</div>";$("#div1").append(charHtml);};var colorBox=function(){Color=[]; //用数组存放颜色的样式Color[0]="#ff2211";Color[1]="#ff3311";Color[2]="#ff5511";Color[3]="#ff8811";Color[4]="#ffBB99";Color[5]="#1ff4f1";Color[6]="#ff5566";Color[7]="#668899";Color[8]="#99BBfA";Color[9]="#fECECC";return Color[parseInt(Math.random()*10)];   //随机生颜色.}//每隔三秒就调用些方法生产字母
function accrueChar(){//把随机出来的放在动画队列里var _sildeFun=[//把要执行的动画依次放入一个数组里function(){$('#div1 div').animate({top:'+=470px'},speed,function(){//当动画执行完时,就删除$(this).remove();count-=10;$("input[type='text']").attr({"value":count});});}];//将函数组放入slideList动画队列里$("#div1").queue('slideList',_sildeFun);var _takeStart=function(){//从队列最前端移除一个队列函数，并执行他。$("#div1").dequeue("slideList");};function randCharHandle(){randomChar();_takeStart();}randCharHandle();
}//健码的处理
function keyCode(event){var keyValue = event.keyCode;var flag=false;//alert(keyValue);for(var i=0;i<=arrCode.length;i++){if(keyValue==arrCode[i]&&$("#"+charArray[i]+"").text()!=""){//选对后停止一秒$("#"+charArray[i]+"").stop(1000).remove();//选对就加10分count+=10;$("input[type='text']").attr({"value":count});$("#right").text(keyRight);flag=true;break;} }if(flag){flag=false;keyRight++;$("#right").text(keyRight);}else{keyErro++;$("#erro").text(keyErro);}
}$(function(){//加速
$("input[value='加速++']").click(function(){if(speed>0)speed-=1000;
});//减速
$("input[value='减速--']").click(function(){speed+=1000;
});});
window.setInterval("accrueChar()",1500);/*******************************************HTML页面***************************************************/
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script type="text/javascript" src="../../jQuery/jquery-1.8.3.js"></script>
<script type="text/javascript" src="test.js"></script>
<title>打字游戏</title>
<style type="text/css">
#div1{border: 2px red solid;width:500px;height: 500px;background-color: black;
}
.char{width: 20px;height:20px;position:absolute;font: 40px;}
</style>
</head>
<body οnkeypress="keyCode(event)"><div id="div1"></div><div><br>总数:<input type="text" readonly="readonly"><input type="button" value="加速++"><input type="button" value="减速--"><br>错误次数:<label id="erro"></label><br>正确次数:<label id="right"></label></div>
</body>
</html>

转载于:https://www.cnblogs.com/ranran/p/3955572.html

jQuery 写的简单打字游戏相关推荐

jquery写的捡元宝游戏
我用jquery写的捡元宝游戏. 用时两个空闲下午. 明天又要开发新需求了.
Java 实现简单打字游戏
打字游戏题目: 代码实现: 题目: 编写一个打字游戏,从一个面板顶端随机出现一些字母,字母按一定的时间自顶向下移动,如果字母接触到面板底端则Game Over,用户可以通过敲击键盘消除移动中的字母. ...
Pygame 简单打字游戏
功能描述: 1.点击开始游戏,会出现一段英文文章,并进入60s倒计时 2.如果一分钟内输入完成这段会自动呈现下一段 3.单词正确数实时统计,背景颜色随输入速度而变化代码: 注意:上面动态图需要放在游 ...
html简单打字游戏,javascript实现简单打字游戏
本文实例为大家分享了javascript打字游戏的具体代码,供大家参考,具体内容如下传智打字游戏 .label{ position:absolute;left: 0px; } var CODE = ...
html简单打字游戏,javascript实现的简单打字游戏
传智打字游戏 .label{ position:absolute;left: 0px; } var CODE = "QWERTYUIOPASDFGHJKLZXCVBNM"; var ...
如何编辑简单打字游戏
先来简单看一下要求一,我们可以先编写Player类,先把属性定义好,然后进行封装 public class Player {private String name; //定义姓名private in ...
Tizen系统开发尝试，写一个简单的游戏
1.第一步下载官方sdk.官方开发者社区:点我 2.安装好,打开IDE,是基于Eclipse的. sdk2.2官方提供native和web两种开发模式,在右上角随意切换,跟eclipse切换c++和j ...
用Python写一个简单的游戏脚本，让你成为游戏里面的大佬！
想必大家都喜欢玩游戏吧,现在游戏市场是非常火爆和可观的,不少程序员都纷纷涌入游戏公司,我们学习python其实也可以作为写游戏脚本的,不清楚的小伙伴可以来看下了哦~ 以楚留香的电脑版为例,记录脚本的编 ...
jQuery写一个简单的弹幕墙
近几年由于直播,弹幕流行起来,之前看到过用js制作弹幕墙的思路,觉得很有趣.自己就花了点时间把他做成了更灵活的jQuery插件,现在分享出来. 详细代码下载:http://www.demodashi ...
HTML5写的简单小游戏-绵羊快跑
为什么80%的码农都做不了架构师?>>> 用HTML5仿一款灵敏测试的flash小游戏程序: 完整程序在我博客:http://meego123.net/post-61.html ...

jQuery 写的简单打字游戏

jQuery 写的简单打字游戏相关推荐

最新文章

热门文章