11

I would like to display the user selected help file when pressing F1. This should work on every browser where I test my application. How can I stop the default help file from being displayed?

Andy E
  • 338,112
  • 86
  • 474
  • 445
Developer
  • 8,390
  • 41
  • 129
  • 238

2 Answers2

16

AFAIK, the default action of the F1 key can be changed in any browser except for IE. The Microsoft teams are usually sticklers for maintaining a consistent user experience across their applications and that's why F1 opens help regardless of returning false. That being said, there's a workaround in the form of the window.onhelp event.

// Internet Explorer
if ("onhelp" in window)
    window.onhelp = function () { 
        showMyHelpInsteadOfTheUsualDefaultHelpWindow(true); 
        return false;
    }
// Others
else {
    document.onkeydown = function(evt) {
        cancelKeypress = (evt.keyCode == 112);
        if (cancelKeypress) {  // F1 was pressed
            showMyHelpInsteadOfTheUsualDefaultHelpWindow(true);
            return false;
        }
    }

    // Additional step required for Opera
    document.onkeypress = function(evt) {
        if (cancelKeypress) 
            return false;
    }
}

"Others" step was adapted from a deleted answer, which was adapted from another answer which, in turn, was adapted from another answer.

Community
  • 1
  • 1
Andy E
  • 338,112
  • 86
  • 474
  • 445
  • 1
    Oh no, they try to prevent mangling the normal user experience (which is not a bad thing, IMHO), but they provide another (easier) function to be able to do exactly that? – Marcel Korpel Aug 04 '10 at 12:32
  • @Marcel: I worded that wrong. The *onhelp* event is intentionally provided to replace the default help, but it's also intentional that the F1 key cannot be cancelled. Weird, I know. – Andy E Aug 04 '10 at 12:35
2

Actually, you can cancel the native Help in IE, by setting event.keyCode to 0:

Tested in IE8 & Chrome

<!DOCTYPE html>
<html>
    <head>
        <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
        <script type="text/javascript">
            $(function () {
                var cancelKeypress = false;
                // Need to cancel event (only applies to IE)
                if ( "onhelp" in window ) {
                    // (jQuery cannot bind "onhelp" event)
                    window.onhelp = function () {
                        return false;
                    };
                }
                $(document).keydown(function ( evt ) {
                    // F1 pressed
                    if ( evt.keyCode === 112 ) {
                        if ( window.event ) {
                            // Write back to IE's event object
                            window.event.keyCode = 0;
                        }
                        cancelKeypress = true;

                        // Trigger custom help here
                        alert("My help");

                        return false;
                    }
                });
                // Needed for Opera (as in Andy E's answer)
                $(document).keypress(function ( evt ) {
                    if ( cancelKeypress ) {
                        cancelKeypress = false; // Only this keypress
                        return false;
                    }
                });
            });
        </script>
    </head>
    <body>

    </body>
</html>
Dan Phillimore
  • 470
  • 4
  • 10