Why keydown listener doesn't work in IE

Ixx picture Ixx · Feb 29, 2012 · Viewed 13.4k times · Source

Im trying to run this in IE 8 but it doesn't work, any idea? It works in Firefox, Chrome, Opera...

preventBackspace();

function preventBackspace() {
    try {
        if (window.addEventListener) {
            window.addEventListener("keydown", onKeyDown, true);
        } else if (window.attachEvent) { // IE 
            alert(window);
            window.attachEvent("onkeydown", onKeyDown);
        } else {
            document.addEventListener("keydown", onKeyDown, true);
        }
        } catch (e) {
            alert(e);
    }
}

function onKeyDown(e) {
    alert("test!");
}

jsfiddle:

http://jsfiddle.net/ubfBq/

window.attachEvent is defined and the event listener added. But it never shows "test!" alert.

I read something about useCapture flag, which is possible to use in the other methods. It captures the key press on the window before the event "goes down". Internet Explorer doesn't seem to allow/use this. Is that the problem? If yes, how can I solve it?

Answer

Jonathan Lonowski picture Jonathan Lonowski · Feb 29, 2012

It appears that only IE9 and later support binding keydown on window: http://www.quirksmode.org/dom/events/keys.html#t00

Instead, bind it to the document for IE:

function preventBackspace() {
    try {
        if (window.addEventListener) {
            window.addEventListener("keydown", onKeyDown, true);
        } else if (document.attachEvent) { // IE 
            alert(document);
            document.attachEvent("onkeydown", onKeyDown);
        } else {
            document.addEventListener("keydown", onKeyDown, true);
        }
    } catch (e) {
        alert(e);
    }
}