将 javascript 变量从 iframe 传递到父框架答案

【问题标题】：pass a javascript variable from an iframe to the parent frame将 javascript 变量从 iframe 传递到父框架
【发布时间】：2014-07-21 12:23:32
【问题描述】：

所以我的 iframe 中有一个变量，如下所示：

 <script>
var zipphone = "<?= $phone ?>";
 </script>

现在我想在加载 iframe 后将该变量传递给父框架。最简单的方法是什么？

【问题讨论】：

在iframe上加个onload函数怎么样？

标签： javascript

【解决方案1】：

如果页面都在同一个域中，你可以调用父窗口的函数：

window.parent.zipPhoneCallback(zipphone);

在父窗口中，你可以这样定义一个函数：

function zipPhoneCallback(zipphone) {
    ((console&&console.log)||alert)("zipphone = " + zipphone);
}

【讨论】：

我无法让它工作。你能进一步解释一下吗？另外，在加载 iframe 之后，如何防止这种情况发生。我问的原因是因为直到在父框架上提交表单之后我才加载 iframe。
@zach：对我来说很好。 Here's a more concrete example. 顺便说一下，你可能想把你的问题过一遍，如果有满意的答案，点击旁边的空心复选标记将其标记为答案，此时它会变成绿色。

【解决方案2】：

注意好像有a Chrome browser issue with addressing variables from webpages to or from IFRAMES.这个问题离线测试出现。

除此之外，假设您的浏览器实际上实现了 Javascript 的基本功能，您可以使用 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 = "....";

等等。

示例。

DOC1.HTM 内容 -

<!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 内容 -

<!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>

即使在旧版本的 Internet Explorer 上也能正常工作，但在使用 Chrome 进行离线测试时尝试它，并且 window.iframename.test_var 似乎由于 Chrome 问题而未定义。

无论如何，请留意 Chrome 的未来版本来解决这个问题，因为谷歌的脸上有很多鸡蛋，而他们还没有。

我在 Chrome 离线测试中解决了这个问题。

感谢 WebmasterWorld 上的 Lucy24 提供的帮助。 http://www.webmasterworld.com/google_chrome/4689258.htm#msg4689342

当我离线测试我的 javascript 并且文件 doc1.htm 和 doc2.htm 位于我的 PC 上的同一文件夹中时，Chrome 出现了这个问题。

将 doc1.htm 和 doc2.htm 文件移动到我测试服务器端 php 程序的文件夹中，该程序使用 Windows Internet 服务管理器运行，这意味着我可以使用 h t t p : // l o c a l h o s t 地址和宾果游戏来处理文件，Chrome 的行为因为它应该在离线模式下表现。

在我看来，Chrome 的 javascript 不能直接寻址同一个离线文件夹中的文件是不“合法的”。

当您在自己的 PC 上运行自己的 javascript 文件时，绝对没有安全问题。或者，如果 Chrome 想要提供一个允许或禁止离线 IFRAME 变量作用域的安全设置，那么就可以了。

我提交的错误消息根本不清楚，Lucy24 很好地弄清楚了它的含义。

如果 Internet Explorer 和 Firefox 等允许您离线测试您的 javascript，那么 Chrome 为何不可以呢？

Lucy24 干得好。 Chrome做得不太好。

【讨论】：