views:

183

answers:

4

A 3rd party script on my web page creates an iframe. I need to know when this iframe is ready, so I can manipulate its DOM.

I can think of a hacky approach: repeatedly try to modify the iFrame's DOM, and return success when a change we make sticks between two attempts. For this to work, I would prefer a property I can check on the iframe repeatedly.

Is there an alternative, cross-browser evented approach to knowing that the iframe is ready? E.g. can we redefine the onLoad function to call into our code (but I don't know if I can do this, since I didn't create the iframe).

A: 

Can you inject arbitrary scripting code into your iframe? If so, you should be able to make it so that some code executes in the iframe upon the the iframe loading that calls code in the parent page.

Rice Flour Cookies
A: 

Have a variable in the parent:

var setToLoad = false;

Follow it up with a function to set it:

function SetToLoad() {
    setToLoad = true;
}

Then in the child iframe call this function using the window.opener

function CallSetToLoad() {
    window.opener.SetToLoad();
}

window.onload = CallSetToLoad;

This won't run until the iframe is finished loading, and if it's in the same domain it'll allow access to the opener. This would require editing a small portion of the 3rd party script.

EDIT: Alternative solution

Given that you can't edit the script, you might try something like:

frames["myiframe"].onload = function()
{
    // do your stuff here
}
Joel Etherton
This won't work for me, because I can't make changes to the 3rd party script (or ask for them)
Bilal Aslam
@Bilal Aslam: added an edit
Joel Etherton
A: 

First: You probably won't be able to manipulate its dom when it loads html from other domain

And You probably are interested in DOMready. Look here: http://stackoverflow.com/questions/205087/jquery-ready-in-a-dynamically-inserted-iframe

naugtur
A: 

using jquery?

function callIframe(url, callback) {
    $(document.body).append('<IFRAME id="myId" ...>');
    $('iframe#myId').attr('src', url);

    $('iframe#myId').load(function() 
    {
        callback(this);
    });
}

Question answered in http://stackoverflow.com/questions/205087/jquery-ready-in-a-dynamically-inserted-iframe

mythz