pass a javascript variable from an iframe to the parent frame
So I have a variable in my iframe like so:
<script>
var zipphone = "<?= $phone ?>";
</script>
Now I want to pass that variable to the parent frame after the iframe is loaded. What is the simplest way to do that?
If the pages are both on the same domain, you could call a function of the parent window:
window.parent.zipPhoneCallback(zipphone);
In the parent window, you could define a function like this:
function zipPhoneCallback(zipphone) {
((console&&console.log)||alert)("zipphone = " + zipphone);
}
Beware there seems to be a Chrome browser issue with addressing variables from webpages to or from IFRAMES. This issue appears in offline testing.
That aside, assuming your browser actually implements basic functions of Javascript, you address your variable from your main webpage using window.myiframename.zipphone
<IFRAME NAME="myiframename" SRC="myzipphoneiframefile.htm" ....
<script type="text/javascript">
<!--
// then whatever you do with your variable
// read it
var z = window.myiframename.zipphone;
// write to it
window.myiframename.zipphone = "....";
and so on.
Example.
DOC1.HTM contents -
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>DOC1.HTM</title>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
</head>
<body bgcolor=pink>
<h1>DOC1.HTM</h1>
<iframe name="iframename" src="doc2.htm"></iframe>
<p>
<br />
<a href="#" onclick="alert('The value of the variable test_var set by a script in DOC2.HTM embedded in the DOC1.HTM page by an iframe named IFRAMENAME as read from a script running in DOC1.HTM appears to be - ' + window.iframename.test_var);return false;">check variable</a>
</p>
</body>
</html>
DOC2.HTM contents -
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>DOC2.HTM</title>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
</head>
<body bgcolor=red>
<script type="text/javascript">
var test_var="testing, testing . . .";
</script>
<h1>DOC2.HTM</h1>
</body>
</html>
That works beautifully even with older versions of Internet Explorer but try it when offline testing with Chrome and window.iframename.test_var appears to be undefined because of the Chrome issue.
Anyway, look out for future versions of Chrome fixing this because it is a lot of egg on Google's face while they haven't.
I have a work-around for this issue in Chrome offline testing.
Thanks to Lucy24 on WebmasterWorld for helping. http://www.webmasterworld.com/google_chrome/4689258.htm#msg4689342
This issue with Chrome arose when my javascript was being tested off line and files doc1.htm and doc2.htm are in the same folder on my PC.
Moving the doc1.htm & doc2.htm files to a folder where I test my server side php programs, which runs using Windows Internet Services Manager means I can address the files using h t t p : / / l o c a l h o s t addresses and bingo, Chrome behaves as it should have behaved in offline mode.
It is not "legitimate" in my opinion for Chrome's javascript not to be able to directly address files in the same offline folder.
There's absolutely no security issue when you are running your own javascript files on your own PC. Or if Chrome wanted to offer a security setting that allowed or disallowed offline IFRAME variable scoping then OK, that would be fine.
The error message is not at all clear I submit and Lucy24 did well to figure out what it meant.
If Internet Explorer and Firefox etc allow you to test your javascript offline then why not Chrome?
So well done Lucy24. Not so well done Chrome.
加载中,请稍侯......
精彩评论