个人中心
gpt4 book ai didi

javascript - 单击按钮后关闭使用 window.open() 打开的窗口

转载 作者：行者123 更新时间：2023-11-30 15:52:37 25 4
gpt4 key购买 nike

我这里有一个简单的案例:

我使用 window.open('http://remoteserver.com/success') 在浏览器中打开一个窗口，如下所示:

const win = window.open('http://remoteserver.com/success')

现在远程服务器发送这样的 HTML:

<!DOCTYPE html>
<html lang="en">
  <body>
  <div class="row text-center" style="margin-top:50px">
    Success!
    <button type="button" class="btn btn-primary" onclick="closeWindow()">Go Back</button>
  </div>
  </body>
  <script >
  function closeWindow(e)
  {
    this.close()
    console.log(e);
  }
  </script>
</html>

现在，当用户点击“返回”按钮时，它会显示一条警告，提示窗口只能由打开它的脚本关闭!

如何关闭这样的窗口？

最佳答案

您可以使用 window.postMessage()将消息发布到父窗口。在父窗口中，监听新消息并在收到来自正确来源的包含正确数据的消息时关闭窗口。

const popup = window.open('http://example.com/success')
window.addEventListener('message', event => {
  // Only accept messages from http://example.com.
  if (event.origin === 'http://example.com') {
    if (event.data === 'close') popup.close()
  }
})

HTML 文件:

<!DOCTYPE html>
<html lang="en">
  <body>
  <div class="row text-center" style="margin-top:50px">
    Success!
    <button type="button" class="btn btn-primary">Go Back</button>
  </div>
  </body>
  <script>
    document.querySelector('button').addEventListener('click', () => {
      // Only send messages to http://example.com.
      window.opener.postMessage('close', 'http://example.com')
    })
  </script>
</html>

关于javascript - 单击按钮后关闭使用 window.open() 打开的窗口，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/39081098/

25 4 0
文章推荐： javascript - 在 C# 中使用 javascript/jquery 函数在 5 秒后隐藏一个 div 和标签
文章推荐： c - 指针数组 - 从文件读取 - 崩溃
文章推荐： c - main函数在返回0后不会退出，shmctl不会删除段
文章推荐： javascript - 提交表单后隐藏div
行者123
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
全站热门文章
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com