js实现关闭子窗口时刷新父窗口

 

当我们在子窗口中关闭窗口时，可以使用JavaScript来刷新父窗口。下面是一个详细的介绍：

1. 获取父窗口对象：

   - 在子窗口中，可以使用`window.parent`属性获取父窗口的全局对象。

   - 通过`window.parent`，我们可以访问父窗口的各种属性和方法。

2. 关闭子窗口：

   - 在子窗口中，可以使用`window.close()`方法来关闭当前窗口。

   - 当我们调用`window.close()`时，子窗口将被关闭并从浏览器中移除。

3. 在子窗口中发送消息给父窗口：

   - 在关闭子窗口之前，我们可以向父窗口发送一个自定义消息，以通知父窗口刷新页面。

   - 可以使用`window.postMessage()`方法发送消息给父窗口。

4. 在父窗口中监听消息事件：

   - 在父窗口中，我们需要添加一个事件监听器来接收子窗口发送的消息。

   - 可以使用`window.addEventListener()`方法来监听消息事件，并定义相应的回调函数。

5. 在父窗口中刷新页面：

   - 在父窗口接收到子窗口发送的刷新消息后，我们可以在回调函数中执行页面刷新的操作。

   - 可以使用`location.reload()`方法来刷新当前页面。

6. 设置跨域消息传递：

   - 如果子窗口和父窗口的域不同，可能会涉及到跨域问题。

   - 在这种情况下，我们需要在父窗口和子窗口之间设置合适的跨域消息传递机制，例如使用`window.postMessage()`方法的第二个参数指定接收消息的来源。

7. 兼容性考虑：

   - 在处理窗口关闭和刷新事件时，要考虑不同浏览器的兼容性。

   - 可以使用条件语句或浏览器特定的API来处理不同浏览器的差异。

总结：通过获取父窗口对象、关闭子窗口、发送消息给父窗口、监听消息事件、刷新父窗口页面等步骤，我们可以实现在关闭子窗口时刷新父窗口。同时，还需要考虑跨域传递消息和浏览器兼容性。

本文原文来自：薪火数据   js实现关闭子窗口时刷新父窗口 (datainside.com.cn)