How to grab keyboard events on an element which doesn’t accept focus?

A div by default cannot be given focus. However, you can change that by adding a tabindex attribute to the div: <div tabindex=”0″ id=”example”></div> You can then give the div focus, and also blur it with the hover event: $(“#example”).hover(function() { this.focus(); }, function() { this.blur(); }).keydown(function(e) { alert(e.keyCode); }); When the div has focus, … Read more

change keyboard layout with javascript

You won’t be able to change the keyboard layout using JS, but you can capture the keydown event and replace the character with something like this: http://jsfiddle.net/SxdKZ/ $(‘textarea’).on(‘keydown’, function(e){ console.log(e.keyCode); if( e.keyCode == 90 ){ e.preventDefault(); $(this).append(‘y’).focus(); } if( e.keyCode == 89 ){ e.preventDefault(); $(this).append(‘z’).focus(); } });​

Handling key-press events (F1-F12) using JavaScript and jQuery, cross-browser

I agree with William that in general it is a bad idea to hijack the function keys. That said, I found the shortcut library that adds this functionality, as well as other keyboard shortcuts and combination, in a very slick way. Single keystroke: shortcut.add(“F1”, function() { alert(“F1 pressed”); }); Combination of keystrokes: shortcut.add(“Ctrl+Shift+A”, function() { … Read more