Iframe onload event is not a good idea to listening child page loading state on Internet Explorer. Here are some solutions to make things better.
None-Cross-Domain
If the parent page and the child page is in the same domain, they can share the objects between the windows. For example: “window.parent.document.getElementById(’div_01′)” will be fine. So we can easily get things done. Just like this:
<!--This is an inner page in the iframe-->
<script type="text/javascript">
window.onload=function{
window.parent.iframeCall();
}
</script>
Cross-Domain
According to REFERENCES Q239638 and Q188763, there are two ways:
1.Timer & document.readyState
var fm1=window.frames["iframe1"];
var fmState=function(){
var state=null;
if(document.readyState){
try{
state=fm1.document.readyState;
}catch(e){state=null;}
if(state=="complete" || !state){//loading,interactive,complete
//onComplete();
return;
}
window.setTimeout(fmState,10);
}
};
window.setTimeout(fmState,400);//call this statement when iframe page start to change
A few microseconds is need, because DOM actions is asynchronous, we need to wait until the action has started.
2.onreadystatechange & counting state
var stateID={};
var fmStChange=function(){
if(ifFirstLoad) return;
stateID[this.id]=stateID[this.id] ? stateID[this.id]+1:1;
switch (stateID[this.id]){
case 1:
//state loading
//onComplete(STEP1);
break;
case 2:
//state interactive
//onComplete(STEP2);
break;
case 3:
//state complete
//onComplete(LASTSTEP);
break;
}
if(stateID[this.id]>=3) stateID[this.id]=null;
};
$("iframe1").onreadystatechange=fmStChange;
//if you want to ignore the parent page load
//add the following two line
var ifFirstLoad=true;
$("iframe1").onload=function(){ifFirstLoad=false;}
The process will return three types of state: loading,interactive and complete. But don’t disturb the loading process untill one is finished, or else the stateID will not tell the correct state .
document.domain property
An article said document.domain property will be use to fix “Access Denied Error”:
The document.domain property can be set to ease the restriction somewhat.For example, if a document at www.example.com wants to communicate with a document at forums.example.com, the document.domain property could be set to example.com in both documents to allow JavaScript interaction between them.
I never try out, but I don’t think this will work.
None-IE
Iframe onload event is good for Firefox, Opera and Safari.
Popularity: 77% [?]