Question

根据this页面，我应该可以调用子窗口的参数和功能，但它对我不起作用。

var w = window.open("index.html");
console.log(w);
console.log(w.foo);

console.log(w)表示有一个名为foo但console.log(w.foo)输出undefined的函数。这是安全问题吗？

编辑以下是更多功能：

child.html（省略正文）：

<head>
 <script type="text/javascript"> 
  test = 123 ;
  function foo(arg){
   //do something
  }
 </script>
</head>

parent.html：

var w = window.open("child.html");
console.log(w);
//outputs all the methods and parameters
console.log(w.foo);
//outputs 'undefined'
console.log(w.test);
//outputs 'undefined'

编辑2 此外，我应该解释为什么我需要传递参数，因为有人会不可避免地问我为什么我不能“只是硬编码”。我有一个HTML canvas元素，每次用户右键单击时，都会出现一个右键菜单，其中包含“下面列出形状”选项。

当用户单击此菜单项时，我想传递该单击下面所有形状的列表，并在新窗口中显示它。以下是我面临的问题：

我无法将其作为参数传递b / c我不知道窗口是否已加载（我似乎无法更改onload函数）
我无法让子窗口查询父窗口b / c点击后右键菜单消失。

Answer 1

问题在于，在尝试检查其内容之前，您没有给子窗口的DOM提供加载的机会。

console.log(w)似乎可以通过立即显示Window或类似内容来工作，但实际上只是当您的人手指在控制台中扩展项目详细信息时，属性和方法< em> 在场。

当我在Firebug断点的帮助下注入延迟时，我可以看到子窗口的属性就好了。

This question讨论为子项添加onLoad事件侦听器。使用其接受的答案，如何：

<script type="text/javascript">
// parent.html
var w;

function lol() {
    console.log(w.foo);
    console.log(w.test);
}

w = window.open("child.html");
console.log(w);
w.addEventListener('load', lol, true);
</script>

（我也能在1s setTimeout延迟时取得成功。）

Answer 2

如果你从逻辑上看代码，答案就很简单

以下两个调用仅适用于您打开的窗口。

console.log(w.foo);
//outputs 'undefined'
console.log(w.test);
//outputs 'undefined'

即

console.log(foo);

在父窗口javascript和

中

console.log(window.parent.foo);

在子窗口javascript。

跨HTML窗口的Javascript函数调用

2 个答案: