Invoking a function in an iframe from the parent window
I can't figure out what I'm doing wrong here.
I am building a website with no server-side I have a main page with an iframe and on a button click I want the iframe's src to change and a function in it to be invoked with a passed parameter.
The function is not called for some reason.
here's my code:
the iframe:
<iframe id="main_area_frame" name="main_area_frame" src="" frameborder="0" width="100%" height="100%"></iframe>
the onclick function:
function onSubMenuClick(images)
{
//Set Images Frame
main_area = document.getElementById("main_area_frame");
main_area.src = "ImagesFrame.html";
main_area.contentWindow.initializeImages(images);
}
the function in the iframe(ImagesFrame.html):
function initializeImages(imagesStr)
{
alert("initializeImages");
...
}
some weird things I noticed are that
when adding an alert just before main_area.contentW开发者_StackOverflow社区indow.initializeImages(images); the function is somehow called successfully.
if I set the iframe's src from the begining and skip the line main_area.src = "ImagesFrame.html"; - the function is again, called.
any ideas?
Not sure if that is the cause, but I would try putting a delay(sleep) between
main_area.src = "ImagesFrame.html";
and
main_area.contentWindow.initializeImages(images);
in order to allow the iframe to be rendered (I do not know if it is the rendered by the same frame or the browser launches a new one).
Just my two cents.
I have had success with publishing the function from the child iframe during onload handling. For example, (substituting your funcName):
In child iframe, edit body tag (or use equivalent javascript)
<body onload='top.funcName = funcName'>
In parent page, edit javascript; now the
funcName will be generally accessible as,
value = top.funcName( )
精彩评论