How to track modifier keys using javascript/jquery?

Question

My requirement is just easy: user press Ctrl key some notification appear on my page, and when released the notifications just disappear, so i need to track modifier keys such as Ctrl. Unfortunately i google and didn't find any clues, some famous keyboard libs such as Mousetrap and keymaster seem also does not cover this topic.

Any ideas?

Answer 1

With jQuery, you can just use the keydown and keyup event handlers and you will see the Ctrl key go down and up. If you want to keep track of whether it's down or up, then just set a global flag when it goes down and clear the flag when it goes up.

Example code:

$(document).keydown(function(e) {
    if (e.which == 17) {
        $("#result").append("ctrl key pressed<br>");
    }
});

JQuery doc on e.which: http://api.jquery.com/event.which/

Working demo: http://jsfiddle.net/jfriend00/mezwF/