jQuery hotkeys: prevent IE from running its own shortcuts, like Alt+H

血红的双手。 提交于 2019-12-30 07:33:11

问题


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)


回答1:


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):

$(window).keyup(function (e)
{
    // warning: only tested with EN-US keyboard / locale

    // check whether ALT pressed (and not ALT+CTRL, ALT+SHIFT, etc)
    var key = e.key || String.fromCharCode(e.keyCode);
    if (e.altKey && !e.ctrlKey && !e.shiftKey && key)
    {
        // if ALT pressed, handle the keycode shortcut
        var keyPressed = key.toUpperCase(); // normalize input
        switch (keyPressed)
        {
            case "C":
                // do stuff for ALT-C
                break;
            case "H":
                // do stuff for ALT-H 
                break;
        }
    }
});

Problems/Questions:

  • Uses jQuery, but pure JS solution is not too complicated
  • Is it possible to prevent default browser behavior by canceling event?
  • Will it work in browsers other than Chrome and IE9? (probably FF and Safari)
  • If user releases ALT key BEFORE releasing the letter key, it doesn't work
  • If user presses letter key BEFORE pressing ALT key, it doesn't work
  • Tried using ACCESSKEY attributes, but that only sets focus.. I wanted to click a hyperlink and/or fire some element's click() event based on some ALT-X combination.
  • While this may be acceptable for an enterprise web application (since locale and browser support is usually narrower focus, and since users are typically trained on the software), it may not be acceptable for web sites (due to large number of browsers in use, localization concerns that add to complexity, etc)... would have to think about it some more.

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!)



来源:https://stackoverflow.com/questions/5038100/jquery-hotkeys-prevent-ie-from-running-its-own-shortcuts-like-alth

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!