有关支持多按键游戏的代码问题

橘子派 2013-02-17 09:10:09

下面是html代码，是主页的代码

<html>

<title>pingpang</title>

<head>

	<script src="js/jquery-1.8.2.min.js"></script>

	<script src="js/html5game.pingpang.js"></script>

<style>

	#playground{

	background: #e0ffe0 url(images/pixel_grid.jpg);

	width: 400px;

	height: 200px;

	position: relative;

	overflow: hidden;

	}

	

	#ball{

	background: #fbb;

	position: absolute;

	width: 20px;

	height: 20px;

	left: 150px;

	top: 100px;

	border-radiue: 10px;

	}



	.paddle{

	background: #bbf;

	left: 50px;

	top: 70px;

	position: absolute;

	width: 30px;

	height:	70px;

	}



	#paddleB{

	left: 320px;

	}

</style>





</head>

<body>

<header>pingpang</header>

<div id="game">

	<div id="playground">

		<div id="paddleA" class="paddle"></div>

		<div id="paddleB" class="paddle"></div>

		<div id="ball"></div>

	</div>

</div>

<footer>

	this is a example of creating a ping pang game.

</footer>

</body>

</html>

下面是javascript代码，这段只支持单一的按键，不支持同时多按键。

$(function(){

	$("#paddleB").css("top","20px");

	$("#paddleA").css("top","60px");

});



var KEY = {

UP: 38,

DOWN: 40,

W: 87,

S: 83

}



$(function(){

	$(document).keydown(function(e){

		switch(e.which){

		case KEY.UP:

			var top = parseInt($("#paddleA").css("top"));

			$("#paddleA").css("top",top-5);

			break;

		case KEY.DOWN:

			var top = parseInt($("#paddleA").css("top"));

			$("#paddleA").css("top",top+5);

			break;

		case KEY.W:

			var top = parseInt($("#paddleB").css("top"));

			$("#paddleB").css("top",top-5);

			break;

		case KEY.S:

			var top = parseInt($("#paddleB").css("top"));

			$("#paddleB").css("top",top+5);

			break;

		}

	});

});

下面是支持多按键的代码，就是加了一个setInterval定时器，问题来了
我把上面的javascript代码去掉，换成下面的代码，结果控制不了paddleB和paddleA了。求解？？？？

var pingpang = {}



pingpang.pressKeys = [];



$(function(){

	pingpang.timer=setInterval(gameloop,30);



	$(document).keydown(function(e){

		pingpang.pressedKeys[e.which] = true;

	});



	$(document).keyup(function(e){

		pingpang.pressedKeys[e.which] = false;

	});

});



function gameloop(){

	movePaddles();

}



function movePaddles(){

	if(pingpang.pressedKeys[KEY.UP]){

		var top = parseInt($("#paddleB").css("top"));

		$("#paddleB").css("top",top-5);

	}

	if (pingpang.pressedKeys[KEY.down]){

		var top = parseInt($("#paddleB").css("top"));

		$("#paddleB").css("top",top+5);

	}

	if(pingpang.pressedKeys[KEY.W]){

		var top = parseInt($("#paddleA").css("top"));

		$("#paddleA").css("top",top-5);

	}

	if (pingpang.pressedKeys[KEY.S]){

		var top = parseInt($("#paddleA").css("top"));

		$("#paddleA").css("top",top+5);

	}

}