Using the following example:
domiframetest.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"
/>
<title>DOM Iframe Test</title>
<script type="text/javascript">
function createIframe(){
var Iframe = document.createElement('iframe');
Iframe.id = 'DOMIframe';
Iframe.name = 'DOMIframe';
Iframe.src = 'functiontest.html';
Iframe.style.height = '60px';
Iframe.style.width = '200px';
Iframe.style.border = '1px solid #ff0000';
document.body.appendChild(Iframe);
}
function destroyIframe(){
document.body.removeChild(document.getElementById( 'DOMIframe'));
}
function testIframeFunction(){
window.frames['DOMIframe'].doAlert();
}
</script>
</head>
<body>
<input name="Create Iframe" type="button" value="Create Iframe"
onclick="createIframe(); return false" /> <input name="Destroy Iframe"
type="button" value="Destroy Iframe" onclick="destroyIframe(); return
false" /> <input name="Test Iframe Function" type="button" value="Test
Iframe Function" onclick="testIframeFunction(); return false" /><br />
</body>
</html>
[/code]
functiontest.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"
/>
<title>Function Test</title>
<script type="text/javascript">
function doAlert(){
alert('Function Successful');
}
</script>
</head>
<body>
<p>Function Test</p>
</body>
</html>
I seem to be having a strange problem regarding a DOM created IFRAME
and cross frame scripting.
If I create an IFRAME with DOM and then try and access a function
within the IFRAME everything works as expected. The IFRAME's doAlert()
function fires, everyone is happy.
However, if I then remove the IFRAME element and recreate it, The
IFRAME's doAlert() function DOES NOT fire producing the error
"window.frames.DOMIframe.doAlert is not a function" and everyone is sad
:(
The really strange part is that I can initially create and remove the
IFRAME as many times as I want and the doAlert() function still fires.
As soon as I access the doAlert() function for the first time removing
/ recreating the IFRAME element will break the script.
Everything works as expected in IE, as long as the IFRAME is there, the
doAlert() function fires.
Using the same name / id for the IFRAME should be valid as my intention
is to only have one element created at a time. The Firefox DOM
inspector reports that the node is getting removed properly from the
DOM tree (so I am clearly not overlapping id's).
Which leads me to ???, my only guess is that my frame call is wrong
"window.frames['DOMIframe'].doAlert();" (I have tried numerous other
cross frame calls though) or Firefox has a bug that breaks that call
when your creating / removing DOM elements on the fly.
Any help would be appreciated.
