从 iframe 中设置父窗口变量

Question

我有一个包含嵌入式iframe的父文档。在iframe内部，我有一个上传字段。一旦用户选择要上传的文件，我会触发jQuery change事件。在该事件中，我想将父窗口中的变量设置为true，以便父窗口知道上传已经开始。

有谁知道如何做到这一点吗？

我尝试了以下方法，但没有成功：

var test;
$("#newsletter_email").change(function() {
  parent.window.test = true;

});

$('#send').click(function() {
    if (test) {
        alert('File has been uploaded!');
    } else {
        alert('You need to upload a file');
    }
});

- Nic Hubbard

Answer 1

全局作用域中的变量会自动暴露为包含它们的 window 对象的 DOM 属性。

这意味着

var foo = 'bar';

类似于

window.foo = 'bar';

这意味着你可以阅读任何你可以获得引用的窗口对象的全局范围。我们还可以暗示使用 window 对象是隐式的。即使你没有显式地键入 "window."，它仍然存在。

而且，由于框架本身也被自动公开为当前窗口对象的 DOM 属性，这意味着你也可以访问任何其他框架的 window 对象。

窗口对象的 parent 属性保存对其父窗口（如果有）的 window 对象的引用。由于 iframe 绝对有一个父窗口，所以我刚才输入的所有东西都归结于此。

// set the global variable 'foo' in the parent global scope
parent.foo = 'bar';

- Peter Bailey

---

不。外部文件采用它们所包含在其中的文档范围。 - Peter Bailey

@ErmSo - 和其他函数一样，不多也不少。在 JavaScript 中只有两种作用域：全局作用域和函数作用域。因此，函数作用域内的变量肯定无法在全局作用域中使用。 - Peter Bailey

@makerofthings7 - 不是所有的函数都是全局的。函数名称与变量名称一样，是符号表的一部分，并且成为自己的作用域。编写 function foo(){} 与编写 var foo = function(){} 本质上没有区别。 - Peter Bailey

我刚刚在嵌套的 iframe 中尝试了一下，发现可以这样做：[code]window.top.jsVar = true //使用 window.top 来获取顶级父表单。 - Dan Randolph

@PeterBailey FYI，由于块级作用域已经引入js中，你现在这里的注释已经过时了：let 和 const。 - Jon Surrell

Answer 2

您还可以将其存储在localStorage中，并从中读取和写入，前提是主文档和iframe共享相同的域。

- Marta

---

是的，但并非所有浏览器都支持此功能。 - Nic Hubbard

我知道这有点“尸体帖”，但它与我的工作相关，而且有一些库（store.js和store2.js）可以将localStorage的概念扩展到不受浏览器限制。 - HTTP 501