Using jQuery hotkeys, I try to bind shortcuts like Alt + H, Alt + C to some specific actions in my site. The event propagation stops (as it should) in all browsers but IE. First of all, is it possible to achieve this? If so, how?
Here is a code sample:
jQuery(document).bind('keydown', 'Alt+H',
function (event)
{
$this.toggleMenu( 'H' );
if(jQuery.browser.msie) {
event.cancelBubble = true;
}
else
{
event.stopPropagation();
}
return false;
} );
In IE, the line $this.toggleMenu( 'H' );
gets executed, but then cancelbubble
seems to have no effect (the browser opens its "Help" menu)
This is always a weird thing to attempt (due to browser's built-in hotkeys, etc), but I've had luck with using the onKeyUp event.
The problem with keydown is that it may only be sending one key at a time. So if you hit ALT it's one trigger of keydown, and then C is a second trigger. KeyPress also has probs in some environments because modifier keys like ALT and CTRL don't count as keypresses (I think.. can anybody explain this better?).
If you use keyup you can check whether ALT is being held down while also checking the key. Still working out the kinks, but try this (I only verified in win7: ie9 and chrome):
Problems/Questions:
Hope this helps somebody... feel free to bring on the constructive criticism as this is a feature clients are ALWAYS asking about when I build them web apps. (they are used to the legacy form-driven apps of the 80s and 90s and want extensive keyboard support, which is understandable, especially when they pay for it!)