键盘游戏之canvas--用OO方式写
虽然写的不是很好，但解释权以及版权仍然归13东倍所有！
<!DOCTYPE HTML>
<html><head><title>canvas-00</title><script>window.onload=function(){//alert("coming onload");alert("游戏说明：在键盘上输入的字符与游戏下落的字符相同时，积分板加分，积分达到一定时，提示进入下一关，若字符落到底部，即游戏结束。点击按钮开始游戏吧！");var game=new Game();game.start();}function Game(){//alert("coming Game()");varcreateChar=new Array();//var scoreBoard=new Array();var scoreBoard=new CreateScoreBoard();for(var i=0;i<10;i++){createChar[i]=new CreateChar();//scoreBoard[i]=new CreateScoreBoard();}this.start=function(){var time=setInterval(function(){for(var i=0;i<10;i++){createChar[i].clearContext();//scoreBoard[i].clearScore();}for(var i=0;i<10;i++){createChar[i].move();createChar[i].show();//scoreBoard[i].show();if(createChar[i].return_y()>490){clearInterval(time);for(var i=0;i<10;i++){createChar[i].clearContext();}alert("game over");break;}}scoreBoard.showScore();},50);document.onkeydown=keydown;var jifen=200;var pass=2;function keydown(e){var real=String.fromCharCode(e.which);//alert(real);for(var i=0;i<10;i++){if(real==createChar[i].returnWords()){//alert("zhong");//scoreBoard[i].addScores();scoreBoard.addScores();//alert("00");createChar[i].returnTOP();if(scoreBoard.returnScore()==jifen){jifen+=200;alert("恭喜你，点击确定进入第"+(pass++)+"关！");for(var i=0;i<10;i++){createChar[i].returnTOP();createChar[i].speed();}}}}}}}function CreateChar(){//alert("coming CreateChar()");var canvas;var context;var char_y=50;//规定范围内取随机数 *（上限-下限+1）+下限var char_x;var words=new Array("A","B","C","D","E","F","G","H","I","J","K","L","N","M","O","P","Q","R","S","T","U","V","W","Z","X","Y");var num;var down=1;function initChar(){canvas=document.getElementById("myCanvas");//alert("canvas--"+canvas);context=canvas.getContext("2d");//alert("context--"+context);context.font="20pt 黑体";num=parseInt(Math.random()*words.length);char_x=parseInt(Math.random()*(680-20-1)+20);context.fillText(words[num],char_x,char_y);}initChar();this.move=function(){char_y+=down;}this.show=function(){context.font="20pt 黑体";context.fillText(words[num],char_x,char_y);}this.clearContext=function(){//alert("coming clearContext()");return context.clearRect(0,0,700,500);}this.returnWords=function(){return words[num];}this.return_y=function(){return char_y;}this.returnTOP=function(){char_y=50;//newChar.style.display="none";initChar();}this.speed=function(){down++;}}function CreateScoreBoard(){var canvas;var context;var scores=0;function initScoreBoard(){//alert("coming initScoreBoard()");canvas=document.getElementById("myCanvas");//alert("canvas--"+canvas);context=canvas.getContext("2d");//alert("context--"+context);context.font="20pt 黑体";//context.fillText("得分：0",400,100);}initScoreBoard();this.showScore=function(){//context.clearRect(0,0,700,500);context.font="25pt 黑体";//context.fillText("",500,30);context.fillText("得分："+scores,500,30);}this.addScores=function(){scores+=10;}this.clearScore=function(){//alert("coming clearContext()");return context.clearRect(0,0,700,500);}this.returnScore=function(){return scores;}}</script></head><body><canvas id="myCanvas" width="700" height="500" style="border:1px solid black"></canvas></body></html>
