键盘快捷键的页面刷新会触发按键事件侦听器

时间:2017-08-03 17:42:55

标签: javascript events

我正在制作游戏,学习使用javascript来操作DOM,我遇到了麻烦。目前我有一个事件监听器,所以任何按键操作都将启动我的游戏工作事件监听器工作。我的问题是,如果我从键盘快捷键刷新页面,cmd + r为mac,它就不再按键按键了。更奇怪的是,如果刷新页面从浏览器循环箭头刷新然后我的事件监听器工作并正在等待输入。我怀疑这种情况正在发生,因为键盘刷新会导致事件侦听器在加载所有内容之前触发,然后删除事件侦听器。我已经尝试了各种方法来延迟射击,但似乎没有任何作用。这是我的代码

document.addEventListener("DOMContentLoaded", function(){
  const canvasEl = document.getElementById("game-canvas");
  const ctx = canvasEl.getContext("2d");

  canvasEl.width = Game.DIM_X;
  canvasEl.height = Game.DIM_Y;


  let startUpBackground = new Image();
  startUpBackground.onload = () => {

    ctx.drawImage(startUpBackground, 0, 0, Game.DIM_X, Game.DIM_Y);
    ctx.font = '48px serif';
    ctx.fillStyle = '#FFFFFF';
    ctx.fillText('Press Any Key', Game.DIM_X / 2, Game.DIM_Y / 2);
  };
  startUpBackground.src = "images/space.jpg";

  let startScreenListener = (e) => {
    e.preventDefault();
    console.log('hi');
    ctx.clearRect(0, 0, Game.DIM_X, Game.DIM_Y);
    const game = new Game();
    new GameView(game, ctx).start();
  };

  window.addEventListener('keydown', startScreenListener);

  window.addEventListener('keyup', (e) => {
    e.preventDefault();
    window.removeEventListener('keydown', startScreenListener);
  });

});

0 个答案:

没有答案