弹出窗口以在关闭时将数据返回给父级

Posted 2023-03-10

【中文标题】弹出窗口以在关闭时将数据返回给父级

【英文标题】：Popup window to return data to parent on close

【发布时间】：2012-03-05 18:34:06

【问题描述】：

我使用window.open() 打开了一个弹出窗口。我现在想要的是让用户能够点击这个新窗口中的 2 个链接之一：“允许”或“不允许”。

当用户单击其中一个链接时，“弹出”窗口应该关闭，并返回“允许”或“不允许”或类似的内容，true/false 会这样做，到父窗口。

有可能吗？如果有，怎么做？

代码：

var authWindow = window.open('auth.php', 'authWindow', 'options...');

那么 auth.php 内只有 2 个锚点？

【问题讨论】：

到目前为止，您自己尝试过吗？您可以使用模态弹出窗口

已发布代码？虽然我真的看不出有必要，哈哈。

之后你将如何处理这些值？

我个人尽量避免弹出窗口。通常我使用 jquery-ui 对话框（或 flowtools 覆盖，或 wijmo 对话框）来模拟弹出行为。 IMO 它看起来更好，更干净，并且避免了浏览器阻止弹出窗口的问题 - 只是一个小评论:)

【参考方案1】：

在调用（父）窗口中添加这样的JS代码：

function HandlePopupResult(result) 
    alert("result of popup is: " + result);

在子窗口代码中添加：

function CloseMySelf(sender) 
    try 
        window.opener.HandlePopupResult(sender.getAttribute("result"));
    
    catch (err) 
    window.close();
    return false;

并且有这样的链接可以关闭弹窗：

<a href="#" result="allow" onclick="return CloseMySelf(this);">Allow</a>
<a href="#" result="disallow" onclick="return CloseMySelf(this);">Don't Allow</a>

【讨论】：

function CloseMySelf 导致错误，因为链接直接指向 # 并且窗口没有关闭。

@Joey 抱歉，我的代码中有错误.. 立即查看。 （在 javascript 中，catch 必须有以下括号）

好奇：您是否有理由不将“允许”或“禁止”作为参数传递给 CloseMySelf() 函数？使用结果属性设计有什么好处？

@SteveK 更好地分离了逻辑和代码，因为“允许”和“禁止”是元素本身的一部分，至少在我看来。还提供更好的灵活性，例如如果我们以后想使用更多参数，只需从元素本身读取它们即可。

如果父页面和子页面在同一台服务器上，这只会起作用，对吗？

【参考方案2】：

您可以为此使用window.opener。