Javascript中的按键监听器

时间:2023-03-15
本文介绍了Javascript中的按键监听器的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着跟版网的小编来一起学习吧!

问题描述

我正在为我正在用 JavaScript 开发的游戏寻找 KeyListener.我不知道这在实际代码中是如何工作的,但它会是这样的:

I'm looking for a KeyListener for a game I'm developing in JavaScript. I have no idea how this would work in real code but it would be something like this:

if(keyPress == upKey)
{
    playerSpriteX += 10;
}
else if(keyPress == downKey)
{
    playerSpriteY -= 10;
} 

等等……

我搜索了一下,Google 想出了一些我还不了解的涉及 AJAX 的东西.JavaScript 中是否有内置函数可以执行此操作?

I searched it up, and Google came up with things that involved AJAX which I don't understand yet. Is there a built in function in JavaScript that does this?

推荐答案

这是 2019 年现代浏览器的更新

Here's an update for modern browsers in 2019

let playerSpriteX = 0;

document.addEventListener('keyup', (e) => {
  if (e.code === "ArrowUp")        playerSpriteX += 10
  else if (e.code === "ArrowDown") playerSpriteX -= 10

  document.getElementById('test').innerHTML = 'playerSpriteX = ' + playerSpriteX;
});

Click on this window to focus it, and hit keys up and down
<br><br><br>
<div id="test">playerSpriteX = 0</div>

2013 年的原始答案

Original answer from 2013

window.onkeyup = function(e) {
   var key = e.keyCode ? e.keyCode : e.which;

   if (key == 38) {
       playerSpriteX += 10;
   }else if (key == 40) {
       playerSpriteX -= 10;
   }
}

FIDDLE

这篇关于Javascript中的按键监听器的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持跟版网!

上一篇:javascript可以区分左右shift键吗? 下一篇:如何在不接受焦点的元素上获取键盘事件?

相关文章