How can I avoid autorepeated keydown events in JavaScript?

Question

If the user holds down the key, multiple keydown events are fired. For usability reasons I need to use keydown, not keyup, but I want to avoid this situation. My relevant code is the following:

$(document).keydown(function(e) {          var key = 0;           if (e == null) { key = event.keyCode;}           else {  key = e.which;}            switch(key) {             case config.keys.left:                               goLeft();               break;             case config.keys.up:                                       goUp();               break;             case config.keys.right:                                    goRight();               break;             case config.keys.down:                               goDown();               break;             case config.keys.action:                             select();               break;         }            }); 

So when the user holds down the down key, for example, goDown() is fired multiple times. I would like it to fire just once even if the user holds the key down.

Answer 1

Use event.repeat to detect whether or not the event is repeating. You could then wait for "keyup" before allowing the handler to execute a second time.

var allowed = true;  $(document).keydown(function(event) {    if (event.repeat != undefined) {     allowed = !event.repeat;   }   if (!allowed) return;   allowed = false;   //... });  $(document).keyup(function(e) {    allowed = true; }); $(document).focus(function(e) {    allowed = true; }); 

Answer 2

Another simple adjustment to the accepted answer to allow for the multiple keys scenario:

var keyAllowed = {};  $(document).keydown(function(e) {   if (keyAllowed [e.which] === false) return;   keyAllowed [e.which] = false;   // code to be executed goes here });  $(document).keyup(function(e) {    keyAllowed [e.which] = true; });  $(document).focus(function(e) {    keyAllowed = {}; });