Question

很难正确总结我面临的问题。我正在制作一个随机游戏尝试学习js，但遇到了严重影响玩家动作的问题。

我正在repl.it上进行编码，因为这对我来说比较容易，所以这里是代码的链接，因此如果不是很明显，这里是项目https://repl.it/@PeterChaplin_Sm/Epic-game的链接进入script.js：

//canvasy boi
function setup() {
	createCanvas(500, 400);
}

// rectangular boi records
var rect1 = {x: 5, y: 5, width: 50, height: 50, xspeed: 0, yspeed: 0}
var rect2 = {x: 20, y: 10, width: 50, height: 50, xspeed: 0, yspeed: 5}
var rect3 = {x: 90, y: 50, width: 50, height: 50, xspeed: 0, yspeed: 6}

function draw() {
	background(200);
	
  //rectangular bois
	fill(255, 0, 0);
	rect(rect1.x, rect1.y, rect1.width, rect1.height);

  fill(0, 0, 255);
	rect(rect2.x, rect2.y, rect2.width, rect2.height);
  
  fill(0, 0, 255);
	rect(rect3.x, rect3.y, rect3.width, rect3.height);
  //player movement
	if(rect1.x >= 0 && rect1.x + 50 <= 500) rect1.x += rect1.xspeed;
	if(rect1.y >= 0 && rect1.y + 50 <= 500) rect1.y += rect1.yspeed;
  //asteroids
  if(rect2.x >= 0 && rect2.x + 50 <= 500) rect2.x += rect2.xspeed;
	if(rect2.y >= 0 && rect2.y + 50 <= 500) rect2.y += rect2.yspeed;

  if(rect3.x >= 0 && rect3.x + 50 <= 500) rect3.x += rect3.xspeed;
	if(rect3.y >= 0 && rect3.y + 50 <= 500) rect3.y += rect3.yspeed;

  //JUST MAKE SURE THE FREAKIN RED THING DOESNT GO OUT OF THE FREAKIN BOX
  if(rect1.y <= 0) rect1.y = rect1.y+1;
  if(rect1.x <= 0) rect1.x = rect1.x+1; 
  if(rect1.y >= 350) rect1.y = rect1.y-5;
  if(rect1.x >= 450) rect1.x = rect1.x-1;

  //makes things fall woah
  if(rect2.y >= 400) rect2.y = -50;
  if(rect2.y < 0) rect2.y = rect2.y+rect2.yspeed;

  if(rect3.y >= 400) rect3.y = -50;
  if(rect3.y < 0) rect3.y = rect3.y+rect3.yspeed;

  if (rect1.x < rect2.x + rect2.width &&
   rect1.x + rect1.width > rect2.x &&
   rect1.y < rect2.y + rect2.height &&
   rect1.y + rect1.height > rect2.y) {
     text("Hit!", 250, 25)
  }

  if (rect1.x < rect3.x + rect3.width &&
   rect1.x + rect1.width > rect3.x &&
   rect1.y < rect3.y + rect3.height &&
   rect1.y + rect1.height > rect3.y) {
     text("Hit!", 250, 25)
  }
  
  fill(255,0,0)
  text(rect1.x, 25, 50)
  text(rect1.y, 25, 75)
  fill(0,0,255)
  text(rect2.x, 50, 50)
  text(rect2.y, 50, 75)


  //if(xpos >= cxpos && xpos <= cxpos+50 && ypos >= cypos && ypos <= cypos+50 || xpos+50 >= cxpos && xpos+50 <= cxpos+50 && ypos+50 >= cypos && ypos+50 <= cypos+50) text("DEAD", 25, 100) ;

  //if(deaths >= 1) text("you died you bad person lol", 25, 100), cyspeed=0; 
}

//keypresses
function keyPressed() {
	switch(keyCode) {
		case 37:
		case 65:
			rect1.xspeed = -4;
			break;
		case 39:
		case 68:
			rect1.xspeed = 4;
			break;
		case 38:
		case 87:
			rect1.yspeed = -4;
			break;
		case 40:
		case 83:
			rect1.yspeed = 4;
			break;
	}
}

//keyreleases
function keyReleased() {
	switch(keyCode) {
		case 37:
		case 65:
			rect1.xspeed = 0;
			break;
		case 39:
		case 68:
			rect1.xspeed = 0;
			break;
		case 38:
		case 87:
			rect1.yspeed = 0;
			break;
		case 40:
		case 83:
			rect1.yspeed = 0;
			break;
	}
}

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width">
		<title>repl.it</title>
		<link href="style.css" rel="stylesheet" type="text/css" />
	</head>
	<body>
		<script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.7.3/p5.min.js"></script>
		<script src="script.js"></script>
	</body>
</html>

如果您先运行游戏，然后按住D键，然后按A再释放A，即使仍然按D键并且我不知道如何实现某些操作，角色也不会向左移动可以解决此问题，感谢任何帮助。

如果有人需要有关它的更多信息，请在下面注释您所需的内容。

Answer 1

一种处理此问题的方法是这样的（伪）

onkeydown（仅运动键）将键添加到数组的末尾
onkeyup（仅移动键）从阵列中删除键
如果移动键数组长度> 1，则使用最后一个元素的值进行移动

使用此方法，您还可以根据需要实现对角线移动。

尽管尚未释放键，但是移动键会停止移动

1 个答案: