如何檢查是否按下了某個鍵？

Question

好吧，我在谷歌上搜索，但仍然沒有找到我想要的答案。

我想檢查用戶是否按下了一個鍵，就像這樣 -

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

您必須將事件附加到 window 全局對象並設置一個偵聽事件的函數。 此示例向您展示如何跟蹤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);
    } 
});