javascript - 通过 keydown 进行变量更改

Question

var x = 50;
var y = 50;
document.addEventListener("keydown", checkKey, false);
function checkKey(e) {
  if (e.keyCode == "37") {
   x = x--;
  }
}
document.getElementById("test").innerHTML = x;

当我这样做时，按向左箭头不会改变 x。因此，“test”的innerHTML 不会改变，它保持在50。为什么？

Answer 1

它肯定会更改变量，只是您没有更新 HTML。

将 innerHTML 行放置在事件处理程序内部，以便在有人按下按钮时更新，而不仅仅是在页面加载时更新

var x = 50;
var y = 50;
document.addEventListener("keydown", checkKey, false);
function checkKey(e) {
  if (e.keyCode == "37") {
   x = x--;
   document.getElementById("test").innerHTML = x;
  }
}

注意KeyboardEvent.keyCode不一致，根据MDN

This feature has been removed from the Web standards. Though some browsers may still support it, it is in the process of being dropped.