ansaurus

Question

Answer 1

+2 A:

UPDATED

I've sorted this out now. Sorry for removing the context for the comments below, but hey, the previous versions are still there.

It turns out that there are two problems to be fixed in IE: first is that contrary to what I said before, putting an onkeydown attribute in the <body> doesn't work. You need to attach it to the document instead. The second issue is that IE won't let you suppress magic behaviour such as the search dialog triggered by the F3 key unless you do an evil hack involving changing the keydown event's keyCode property, which is clearly a Very Wrong Thing Indeed. Be that as it may, remove the onkeydown attribute in the <body> and the following should do the job (now amended to work in Opera also):

var keyCodeMap = {
    "1013": "EN",
    "1033": "UP",
    "1034": "DN",
    "1112": "01",
    "1113": "02",
    "1114": "03"
    // ...(F4 thru F24 here)...
};

var suppressKeypress = false;

function setCmdKey(e) {
    e = e || window.event;
    var wrkkeyCode = e.keyCode;
    if (wrkkeyCode != 13 &&
        wrkkeyCode != 33 &&
        wrkkeyCode != 34 &&
        wrkkeyCode != 27 &&
        wrkkeyCode < 112) return;

    wrkkeyCode += 1000;

    if (e.shiftKey) wrkkeyCode += 1000;
    var cmdkeycode = keyCodeMap[wrkkeyCode];
    if (!cmdkeycode) return; /* Anything else should be ignored */

    var input = document.forms[0].elements["CmdKey"];
    input.value = "F" + cmdkeycode;
    input.name = "_K" + cmdkeycode;

    try {
        // Prevent default action in IE by bad hacky means
        e.keyCode = 0;
    } catch (ex) {
        // Other browsers do not allow setting the keyCode
    }
    suppressKeypress = true;

    if (ONSUBMITFUN()) document.forms[0].submit();
    return false;
}

document.onkeydown = setCmdKey;
document.onkeypress = function() {
    if (suppressKeypress) {
        return false;
    }
};

Tim Down 2010-07-20 08:52:01

@Tim, I still need the IE event handling to be stopped via cancelBubble, otherwise the IE default event still occurs (in addition to the page being submitted).

roryhewitt 2010-07-20 20:14:06

Which key? I'm curious, as I wouldn't expect that to be the case.

Tim Down 2010-07-20 21:56:47

In IE, if I use your script and press e.g. F3, the page isn't submitted - the search box is displayed instead. I haven't checked your script in FF - I was checking IE backwards-compatibility first.My assumption is that because this script submits the page, it never gets to the final 'return false' statement - could that be it?

roryhewitt 2010-07-20 23:13:59

That could be it. I'll do a little research.

Tim Down 2010-07-21 07:55:52

Answer rewritten.

Tim Down 2010-07-28 23:01:22

In Opera, you can't suppress the default action `onkeydown`, you have to use `onkeypress` to do so. Also see Jan Wolter's [JavaScript Madness: Keyboard Events](http://unixpapa.com/js/key.html).

Marcel Korpel 2010-07-31 15:58:32

Ha! That could have been one of my comments: I've pointed that fact out many times on SO, with links to that same page. Yes, of course you're right. I'll amend.

Tim Down 2010-07-31 16:49:48

Done. Now works in Opera.

Tim Down 2010-07-31 16:56:32

Nice solution. I usually used a different keyboard handler for Opera (which distinguishes between `event.which` and `event.keyCode`) attached to a `keypress` event if `window.opera` was present.

Marcel Korpel 2010-07-31 20:31:39

Yes, that would work. I tend to go to extreme lengths to avoid using browser sniffs wherever possible, even for relatively innocent ones like checking for the existence of `window.opera`.

Tim Down 2010-07-31 20:49:03

I understand, I usually do that, too. BTW, don't you have to run `event.preventDefault()` in Opera to suppress the default action, or is returning `false` enough?

Marcel Korpel 2010-07-31 20:50:57

I'm pretty sure Opera is the same as other browsers and `return false` is enough when the event listener is assigned via a property rather than via `addEventListener`. It had the desired effect in this case in Opera 10.6. I will go away and check though.

Tim Down 2010-07-31 21:03:09

Oh no! I didn't know it differed whether your event listener was assigned via a property or using `addEventListener`. But, taking the [W3C specification](http://www.w3.org/TR/DOM-Level-2-Events/events.html#Events-Event-preventDefault) into account, I understand the latter is more adhering to the standards.

Marcel Korpel 2010-07-31 21:23:50

There is mention of so-called "DOM0" event handlers in the HTML 4.01 spec: http://www.w3.org/TR/REC-html40/interact/scripts.html. Besides, they've been in browsers for so long and are so widely used that I don't think they'll be going away any time soon.

Tim Down 2010-07-31 21:43:56

Answer 2

A:

You should always return false from event handlers even if you have prevented default by modifying the event, see Quirks mode for more information.

Kristoffer S Hansen 2010-08-03 08:53:55

ansaurus

tags:

views:

answers:

Capturing onkeydown in Javascript

related questions