Question

My problem is I need to capture a keypress but at any given time the user can be inside of an iframe inside of an iframe inside of an iframe.

At first, I thought I could just put the listener on document but that doesn’t work if the user is inside of one of those iframes.

Next I thought of attaching the handler to window but ie doesn’t support attaching event handlers to window. I’m not even sure if that would work though or it would be the same problem as with document.

Next, I thought I could just go through all the iframes and add individual handlers there but eventually realized that wouldn’t work because the iframe doesn’t have any html in the dom so there is no way to access iframes nested in it.

One other possible solution is to go to the js of all the iframes and add this code manually but that is way too extreme.

Any other ideas?

Answer 1

I keep answering my own questions but oh well. If you come across this problem I figured out the answer. This uses jquery but you could port it to straight js if you had to.

var myFunction = function () {
            alert("hello world");
        };
        var $myWindow = $(myWindow /*dom object*/);
        $myWindow.bind("mouseover", myFunction);
        var getNested_iframes = function (document_element) {
            $.each(document_element.find("iframe"), function () {
                var iframeDocument = $(this).get(0).contentWindow.document; // may need to change this depending on browser
                iframeDocument.onkeyup = myFunction;
                getNested_iframes($(iframeDocument));
            });
        }
        getNested_iframes($myWindow);