从同一域上的父窗口访问 iframe 中的 JavaScript 变量答案

【问题标题】：Accessing JavaScript variable in an iframe, from the parent window on same domain从同一域上的父窗口访问 iframe 中的 JavaScript 变量
【发布时间】：2013-01-16 20:05:28
【问题描述】：

我对 JavaScript 相当陌生，我正在尝试从嵌入式 iframe 中获取变量的值。我已经进行了基本测试，以确保我得到了正确的方法......

我已经尝试了常见的建议，一切都返回“未定义”。我想在 onclick 事件中使用该变量。

在 iframe 内容中，我已经剥离了所有内容，仅用于测试：

<script>
var test = "test";
</script>

在父窗口中我已经这样做了：

<iframe src="iframe.html" id="iframe" width="200" height="100"></iframe>

<script>
var myVar = window.frames[0].window.test;
</script>
<a href="#" onclick='alert(myVar)' id="link">Click</a>

我已经尝试过这里建议的选项：grab global variable from an embedded iframe

我所做的一切都返回未定义...我在做一些根本错误的事情吗？

提前谢谢..

【问题讨论】：

您的 JS 代码可能在 iFrame 完成加载之前运行。

标签： javascript jquery iframe

【解决方案1】：

当<iframe> 仍在加载时，您已经在执行脚本，所以test 是undefined。要么等待 iframe 的load 事件，要么点击时获取变量：

<iframe src="iframe.html" id="iframe" width="200" height="100"></iframe>

<script>
var myFrame = window.frames[0].window;
</script>
<a href="#" onclick='alert(myFrame.test)' id="link">Click</a>

【讨论】：

【解决方案2】：

在访问myVar 之前，您显然没有等待加载框架的内容。执行此操作时，框架中的 <script> 元素可能尚未被获取或执行。

尝试延迟变量赋值，直到框架的内容完全加载：

<iframe src="iframe.html" id="iframe" onload="frameLoaded();" width="200" height="100"></iframe>

<script>
    var myVar;
    function frameLoaded() {
        myVar = window.frames[0].window.test;
    }
</script>

顺便说一句，既然你的问题被标记为jquery，我建议你写这样的东西：

<iframe src="iframe.html" id="iframe" width="200" height="100"></iframe>

<script>
    $("#iframe").on("load", function() {
        var myVar = this.window.test;
        $("#link").on("click", function() {
            alert(myVar);
        });
    });
</script>

【讨论】：

这些都不起作用。使用纯 JavaScript，我在 firebug 中收到一个错误，提示 myVar 未定义，因此不会发生 onclick 事件。使用 jQuery 选项，firebug 告诉我 this.window.test 未定义。
@Faldinio，确实，那是因为myVar 在我的回答中是本地的。我不明白你想把它放在全球范围内。答案已相应更新。
老实说，我应该发现它是在函数中而不是在函数外部定义的，但是我盯着同一个代码看太久了！它确实适用于更新的答案。

【解决方案3】：

尝试使用这个

 <iframe src="iframe.html" id="iframe" onload="loader()" width="200" height="100">    </iframe>

<script>
    var myVar
    function loader(){
        myVar = window.frames[0].window.test;
    }
</script>
<a href="#" onclick='alert(myVar)' id="link">Click</a>

【讨论】：

【解决方案4】：

在备用解决方案中，我只想指出，当您使用 jquery onload 事件处理函数并且想要访问 jquery "this" 对象时，您必须使用 $(this.attr) 表示法。

【讨论】：