Keydown 事件未按預期工作。 圖像靜止不動？

Question

我在這里有一張圖片，它位於 canvas 中，但是按下指定的鍵不會導致任何事情發生。 我的代碼 go 哪里錯了？

  let img = document.getElementById("ship");
let player = {
  x: 375,
  y: 550,
  w: 50,
  h: 50,
};
requestAnimationFrame(draw);

function draw() {
  //Logic
  ctx.drawImage(img, player.x, player.y, player.w, player.h);
  //Draw
  ctx.clearRect(0, 0, cnv.width, cnv.height);
  requestAnimationFrame(draw);
}


document.addEventListener("keydown", move);
function move(event) {
    console.log(event.code);
  if (event.code === 39) {
    player.x = player.x + 50;
  } else if (event.code === 37) {
    player.x = player.x - 50;
  } else if (event.code === 40) {
    player.x = player.y - 50;
  } else if (event.code === 38) {
    player.x = player.y + 50;
  }
}

Answer 1

event.code的類型是 DOMString 而不是event.keyCode的數字。

例如：按左箭頭將驗證event.keyCode === 37和event.code === 'ArrowLeft' 。

將code更改為keyCode或您檢查event.code的值，您應該對 go 很好:)

干杯!