在javascript中为新窗口设置回调函数

Question

是否有一种简单的方法可以为在 JavaScript 中打开的新窗口设置“回调”功能？我想从新窗口运行父级的函数，但我希望父级能够设置此特定函数的名称（因此不应在新窗口页面中对其进行硬编码）。

例如在我的父母中：

function DoSomething { alert('Something'); }
...
<input type="button" onClick="OpenNewWindow(linktonewwindow,DoSomething);" />

在子窗口中我想：

<input type="button" onClick="RunCallbackFunction();" />

问题是如何创建这个

OpenNewWindow

和

RunCallbackFunction

函数。我想将函数的名称作为查询参数发送到新窗口（服务器端脚本在生成的子级 HTML 中生成适当的函数调用），这是可行的，但我在想是否有另一种或更好的方法来完成这，也许甚至不需要服务器端修补。

纯 JavaScript、服务器端解决方案和 jQuery（或其他框架）都受到欢迎。

Answer 1

更新评论：如果您通过

window.open()

打开窗口，那么在子页面中，您可以将子页面中的函数设置为指向父函数的引用，因此将其放在子页面中页码：

var RunCallbackFunction = function() { }; //reference holder only

然后在您的父窗口（打开器）中，在加载子窗口时设置该函数，如下所示：

//random function you want to call
function myFunc() { alert("I'm a function in the parent window"); }

//to actually open the window..
var win = window.open("window.html");
win.onload = function() { win.RunCallbackFunction = myFunc; };

这会将您的父级中的函数分配为该子级的目标...如果您愿意，您可以将每个子级指向不同的函数，它们都是独立的。

Answer 2

很抱歉提出一个老问题，但我需要做类似的事情，并且觉得有必要分享一个我满意的解决方案。

家长：

window.open('CHILD_URL', 'CHILD_NAME');
window.addEventListener('message', (event) => {
  if (event.origin !== 'PARENT_URL') return;
  console.log(event.data);
});

孩子：

  window.opener.postMessage(data, document.referrer);
  window.close();

来源（带有一些安全警告和详细文档）： https://developer.mozilla.org/docs/Web/API/Window/open

Answer 3

var newWindow = window.open(window.location.origin);

newWindow.onload = function() {
    $(newWindow.document.body).addClass('new-window-body-class');
};