在 javascript 中禁用键盘

Question

我试图弄清楚如何在分数等于 5 后使键盘被禁用。 其他一切我都很好。 我完成了我需要完成的所有其他事情我只是遇到了键盘问题，如果我能得到一些帮助，将不胜感激。 这只是让我很难过，所以我想我会得到一些帮助。

    //Arrow key codes
var UP = 38;
var DOWN = 40;
var RIGHT = 39;
var LEFT = 37;

//Directions
var moveUp = false;
var moveDown = false;
var moveRight = false;
var moveLeft = false;

//Add keyboard listeners
window.addEventListener("keydown", function(event)
{
  switch(event.keyCode)
  {
    case UP:
        moveUp = true;
        break;
      
      case DOWN:
        moveDown = true;
        break;
        
      case LEFT:
        moveLeft = true;
        break;  
        
      case RIGHT:
        moveRight = true;
        break; 
  }
}, false);

window.addEventListener("keyup", function(event)
{
  switch(event.keyCode)
  {
    case UP:
        moveUp = false;
        break;
      
      case DOWN:
        moveDown = false;
        break;
        
      case LEFT:
        moveLeft = false;
        break;  
        
      case RIGHT:
        moveRight = false;
        break; 
  }
}, false);

function loadHandler()
{ 
  update();
}

function update()
{
  //The animation loop
  requestAnimationFrame(update, canvas);
  
  //Up
  if(moveUp && !moveDown)
  {
    cat.vy = -5;
  }
  //Down
  if(moveDown && !moveUp)
  {
    cat.vy = 5;
  }
  //Left
  if(moveLeft && !moveRight)
  {
    cat.vx = -5;
  }
  //Right
  if(moveRight && !moveLeft)
  {
    cat.vx = 5;
  }
  
  //Set the cat's velocity to zero if none of the keys are being pressed
  if(!moveUp && !moveDown)
  {
    cat.vy = 0;
  }
  if(!moveLeft && !moveRight)
  {
    cat.vx = 0;
  }
  
  //Move the cat 
  cat.x += cat.vx;
  cat.y += cat.vy;
  
  //Check for a collision between the cat and the monster
  //and change the monster's score when they collide
  if(hitTestRectangle(cat, monster) && score < 5)
  {
    if(!collisionHasOccured)
    {
        score++;
        collisionHasOccured = true;
    }
  }
  else
  {
    collisionHasOccured = false;
  }
  
  if(score === 5)
  {
    message = " - Game Over!";
  }
    
  //Render the sprites  
  render();
}

function hitTestRectangle(r1, r2)
{
  //A variable to determine whether there's a collision
  var hit = false;
  
  //Calculate the distance vector
  var vx = r1.centerX() - r2.centerX();
  var vy = r1.centerY() - r2.centerY();
  
  //Figure out the combined half-widths and half-heights
  var combinedHalfWidths = r1.halfWidth() + r2.halfWidth();
  var combinedHalfHeights = r1.halfHeight() + r2.halfHeight();
  
  //Check for a collision on the x axis
  if(Math.abs(vx) < combinedHalfWidths)
  {
    //A collision might be occuring.
    //Check for a collision on the y axis
    if(Math.abs(vy) < combinedHalfHeights)
    {
      //There's definitely a collision happening
      hit = true;
    }
    else
    {
      //There's no collision on the y axis
      hit = false;
    }   
  }
  else
  {
    //There's no collision on the x axis
    hit = false;
  }
  
  return hit;
}

function render(event)
{ 
  drawingSurface.clearRect(0, 0, canvas.width, canvas.height);
  
  if(sprites.length !== 0)
  {
    for(var i = 0; i < sprites.length; i++)
    {
      var sprite = sprites[i];
      drawingSurface.drawImage
      (
        image, 
        sprite.sourceX, sprite.sourceY, 
        sprite.sourceWidth, sprite.sourceHeight,
        Math.floor(sprite.x), Math.floor(sprite.y), 
        sprite.width, sprite.height
      ); 
    }
  }
  
  drawingSurface.fillText(score + message, monster.x, monster.y - 40);
}

</script>

Answer 1

您只需向事件侦听器添加一个if语句。 ( IF score == 5 ) 然后什么也不做。 您可以将代码放在switch语句的正上方。
编辑@JasonEnts：

        window.addEventListener("keydown", function(event)
    { if (score < 5) {
      switch(event.keyCode)
      {
        case UP:
            moveUp = true;
            break;
          
          case DOWN:
            moveDown = true;
            break;
            
          case LEFT:
            moveLeft = true;
            break;  
            
          case RIGHT:
            moveRight = true;
            break; 
      }
    }
 }, false);