Question

In my site, I use an iframeA in an iframeB, and, when the iframeA changes it’s content I have to set the src. I can set it only with the onload event, but this called when the site is loaded. I am looking for some event or trigger, that helps me detect the location/src change before it starts loading. I don’t want to wait the whole page load, before the src set. I have no direct access to iframeA (just the script below)

Some code:

var myframe = document.getElementById('frameB').contentWindow.document.getElementById('frameA');
myframe.onload=function (funcname) {...};

Answer 1

What will be changing the source of the iframe? If you have access to that code then you can do whatever is in your onload function then.

If a link has it’s target attribute set to the iframe and that is how the source is changing then you can hi-jack the link clicks:

$('a[target="frameB"]').bind('click', function () {
    //run your onload code here, it will run as the iframe is downloading the new content
});

Also, just a side-note, you can bind an event handler for the load event in jQuery like this:

$('#frameB').bind('load', function () {
    //run onload code here
});

UPDATE

SITE -> frameB -> frameA

$("#frameB").contents().find("#frameA").bind('load', function () {
    //load code here
});

This selects the #frameB element (that is in the current top level DOM), gets it’s contents, finds the #frameA element, and then binds an event handler for the load event.

Note that this code must be run after #frameB is loaded with the #frameA element already present in it’s DOM. Something like this might be a good idea:

$('#frameB').bind('load', function () {
    $(this).contents().find('#frameA').bind('load', function () {
        //run load code here
    });
});

UPDATE

To hi-jack links in the #frameB element:

$('#frameB').contents().find('a[target="frameA"]').bind('click', function () {
    /*run your code here*/
});

This will find any link in the #frameB element that has its target attribute set to frameA and add a click event handler.

And again, this will only work if the #frameB iframe element has loaded (or atleast gotten to the document.ready event) so you can select it’s elements.