Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How can I check that a key has been pressed?

Well I searched on Google but still didn't found the answer I was looking for.

I want to check if the user pressed a key, something like this -

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

I know I can do this, this way -

document.onkeyup = getKey;

But the function getKey cannot return values.

So how can I check if the user pressed a key?

EDIT : I need pure Javascript for this thing..

like image 298
julian Avatar asked Jan 15 '13 22:01

julian


3 Answers

You can do this in pure Javascript using the event object, without the need of external libraries such as jQuery.

To capture the keycode, just pass the event as parameter of getKey function:

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

document.onkeyup = getKey;

Frequently used keyCode list:

For a usefull list of keyCodes, you can check out this URL:

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

Setting the keyCode to a global variable:

If you are interested in capturing the keyCode for later usage, you can do something like this:

var keycode = "";

(...)

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

document.onkeyup = getKey;


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

Setting the keyCode to the event source object:

If you don't like global variables, like me, you could also do something like this:

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);
like image 127
canolucas Avatar answered Sep 30 '22 13:09

canolucas


One way you could do it is using variables and then you could check that variable some were else...

for example

    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

}
like image 35
ryanc1256 Avatar answered Sep 30 '22 13:09

ryanc1256


You really should not be doing this but if you really must:

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;
  }
})();

This will give you the last key user pressed.

If you need to get the currently pressed key (until released) then you need to attach keydown event to update currentKey variable and keyup event to set it to null.

like image 23
Marko Dumic Avatar answered Sep 30 '22 12:09

Marko Dumic