javascript - 如何检查是否已按下某个键？

Question

好吧，我在 Google 上进行了搜索，但仍然没有找到我想要的答案。

我想检查用户是否按下了一个键，像这样 -

if(document.onkeyup) {
   // Some Stuff here
}

我知道我可以这样做，这样-

document.onkeyup = getKey;

但是该函数getKey不能返回值。

那么如何检查用户是否按下了某个键呢？

编辑：我需要纯Javascript来做这件事..

Answer 1

您可以使用事件对象在纯 Javascript 中执行此操作，而无需 jQuery 等外部库。

要捕获键码，只需将事件作为 getKey 函数的参数传递：

function getKey(e)
{
    window.alert("The key code is: " + e.keyCode);
}

document.onkeyup = getKey;

常用keyCode列表：

有关 keyCode 的有用列表，您可以查看此 URL：

http://www.cambiaresearch.com/articles/15/javascript-char-codes-key-codes

将 keyCode 设置为全局变量：

如果您有兴趣捕获 keyCode 以供以后使用，您可以执行以下操作：

var keycode = "";

(...)

function getKey(e)
{
    keycode = e.keyCode;
}

document.onkeyup = getKey;


window.alert("The key code is: " + keycode);

将 keyCode 设置为事件源对象：

如果你不喜欢全局变量，比如我，你也可以这样做：

function getKey(e)
{
    keycode = e.keyCode;

    var objectFromEvent = e.currentTarget ? e.currentTarget : event.srcElement;

    objectFromEvent.customProperty = keycode;
}


document.customProperty = "";
document.onkeyup = getKey;

// now the value is in the "customProperty" of your object =)

window.alert("The key code is: " + document.customProperty);

Answer 2

您可以做到的一种方法是使用变量，然后您可以检查该变量是否是其他变量...

例如

    var keypressed = "";
    document.onkeyup = function(e){

    if (typeof event !== 'undefined') {
        keypressed = event.keyCode;
      }
      else if (e) {
        keypressed = e.which;
      }  

  return false;   // Prevents the default action

}

Answer 3

您必须将事件附加到窗口全局对象并设置侦听事件的函数。此示例向您展示如何跟踪keyup和keydown事件。

window.addEventListener('keydown', onKeyDown, true);
window.addEventListener('keyup', onKeyUp, true);

function onKeyDown(evt) {
  // key up event as been fired
  console.log(evt.keyCode);
}

function onKeyUp(evt) {
  // key up event as been fired
  console.log(evt.keyCode);
}

有关更多详细信息，请参阅MDN 上的element.addEventListener 。

Answer 4

你真的不应该这样做，但如果你真的必须：

var getKey = (function () {
  var currentKey = null;

  document.onkeyup = function (event) {
    // determine the pressed key (across browsers)
    // by inspecting appropriate properties of `event`
    // and update currentKey; E.g:
    currentkey = event.which ? event.which : window.event.keyCode;
  }

  return function () {
    return currentkey;
  }
})();

这将为您提供最后按下的关键用户。

如果您需要获取当前按下的键（直到释放），那么您需要附加keydown事件以更新currentKey变量和keyup事件以将其设置为null.

Answer 5

我会使用 jquery 并做这样的事情：

   // arrow keys click
$(document).keyup(function(e) {
    // left arrow
    if (e.keyCode == "37" ) {
        // left stuff
    // right arrow
    } else if (e.keyCode == "39") {
        // right stuff
    // up arrow
    } else if (e.keyCode == "38") {
        // up stuff
    // down arrow
    } else if (e.keyCode == "40") { 
        // down stuff
    }
});

等等，对于这里看到的不同的关键代码http://www.cambiaresearch.com/articles/15/javascript-char-codes-key-codes

Answer 6

如果您尝试运行事件以测试何时按下某个键，则可以使用它。

document.addEventListener('keydown', function(event) {
    var key_code = event.keyCode;
    if (key_code === 38) {
        alert('test);
    } 
});