杰晶网络

jQuery 写的简单打字游戏可以提示正确和错误的次数
网络编程 2024/11/15 佚名
3 2 
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="/UploadFiles/2021-04-02/jquery-1.8.3.js">
标签：
jQuery,打字游戏
免责声明：本站文章均来自网站采集或用户投稿，网站不提供任何软件下载或自行开发的软件！ 如有用户或公司发现本站内容信息存在侵权行为，请邮件告知！ 858582#qq.com
www.imxmx.com 杰晶网络
8,675无损音乐
1,324高清电影
213破解软件
120,141站长资源

更新动态

友情链接

杰晶网络 DDR爱好者之家 南强小屋 黑松山资源网 白云城资源网