刷新父页面(window.open打开的页面)

最新推荐文章于 2025-12-15 15:15:21 发布
转载 最新推荐文章于 2025-12-15 15:15:21 发布 · 516 阅读 · 0
文章标签：

#javascript #ViewUI

本文介绍了使用 window.opener 对象刷新父页面的方法，包括通过 location.reload 和 location.href 属性实现页面的重新加载。

刷新父页面(window.open打开的页面)

window.opener.location.reload(true); //true代表从服务器重新获取，false为从缓存中获取,默认为false
或window.opener.location.href = window.opener.location.href;
或window.operner.location.replace(location);
window.open的页面如何刷新(父页面)上层页面
12-09
代码如下: this.ClientScript.RegisterStartupScript(this.GetType(), this.Title, “window.opener.location.reload();alert(‘销帐成功!’);”, true); 主要是这段js代码：window.opener.location.reload(); 如果没特殊要求，可以考虑用div
javascript关于open.window子页面执行完成后刷新父页面的问题分析
10-24
主要介绍了javascript关于open.window子页面执行完成后刷新父页面的问题,实例分析了javascript操作子页面的执行与父页面的刷新技巧,非常具有实用价值,需要的朋友可以参考下
JavaScript window.opener.location.reload
海洋之心
10-21 7160
项目中需要在弹出页面关闭的时候刷新主页面，使用了脚本： window.close();//关闭当前窗口 window.opener.location.reload();//刷新审批主页面 但是每次属性主页面时弹出提示，需要点击“刷新”按钮，感觉有点别扭。在网上搜索了一下解决方法，大致有两种： 1、window.opener.location.reload(true); 2、window.
window.open关闭后刷新父页面
07-22 964
window.onbeforeunload = function (event) { window.opener.location.href = window.opener.location.href; //self.opener.location.reload(true);...
open 关闭子页面刷新父页面
03-09
open 关闭子页面刷新父页面
javascript用window.open的子窗口关闭自己并且刷新父窗口
热门推荐
冯立彬的博客
08-13 2万+
在字窗口的关闭触发事件，采用以下函数：  function closeMeAndReloadParent(){opener.location.reload();window.close();}注：这是东东，把我搞了好久，上午的时候子窗口关闭了，父窗口有像刷新那样的闪动，可是在浏览器的状态栏没有进度加载那样的显示，也就是不能够即时更新我从子窗口中更改的结果并显示出来，如果我用
刷新父页面(WINDOW.OPEN打开的页面)
可乐止饱
11-23 1363
父页面A: window.open('b.html','b页面','width=800,height=500,toolbar=no,scrollbars=no,menubar=no,screenX=200,screenY=200'); 页面B： <script> window.onunload = function () { window.opene...
javascript window.open打开新窗口后无法再次打开该窗口问题的解决方法
10-26
但在实际应用中，开发者可能会遇到这样一个问题，即在使用window.open打开一个新窗口后，再次尝试打开同名的新窗口时，新窗口并没有被创建，而是原有窗口进行了刷新。这通常是因为浏览器会对同名窗口进行引用复用，...
精选资源
javascript 打开页面window.location和window.open的区别.docx
01-13
### JavaScript打开页面window.location与window.open的区别 #### 一、概述 在JavaScript中，`window.location` 和 `window.open` 都是用来控制浏览器导航的重要API，但它们在使用场景、功能特性和行为上有显著的...
精选资源
前端window.open实现激活而非打开的功能
12-22
扩展window.open方法，使得window.open时针对相同的URL地址非打开新窗口，而是仅仅激活已存在窗口，另外，此激活不会刷新页面，不会丢失页面上已存在的数据
解决js中window.open弹出的是上次的缓存页面问题
10-26
然而，有时候我们可能会遇到一个问题：当使用 `window.open()` 打开一个新的URL时，浏览器显示的并不是最新版本的页面，而是之前访问过的缓存版本。这可能对用户体验造成困扰，尤其是当页面内容需要实时更新时。本文...
window.open 子页面刷新父页面
nihousheng的专栏
12-23 721
window.onunload = onunload_handler;   function onunload_handler(){     window.opener.reloadMethod();   } reloadMethod为父页面方法 function reloadMethod(){//获取iframe的src属性，并修改。重新加载当前页。 window.parent.
vue通过window.open打开的页面调用父页面刷新数据
a506602491的专栏
07-23 2989
vue通过window.open打开的页面调用父页面刷新数据 1.在父页面定义方法query 按钮： 打开的子页面调用 //刷新父窗口数据 let parentWin = window.opener; if (parentWin) { parentWin.query(); }
window.open打开的子页面关闭后刷新父页面
k_night_lip的博客
06-19 349
本文介绍了4种在子页面关闭后刷新父页面的方法： 使用window.opener.location.reload()直接刷新父页 通过postMessage进行跨页面通信 在父页面设置关闭回调函数 使用定时器检查子窗口状态 注意事项： 跨域场景下优先使用postMessage 注意浏览器对onbeforeunload中异步操作的限制 不同方法需考虑兼容性和安全性 这些方法适用于需要子页面操作后同步更新父页面数据的场景。
通过window.open打开的新窗口数据发生变化，更新父窗口数据
niuniu2878499107的博客
07-03 643
通过window.open打开的新窗口数据发生变化，更新父窗口数据
window.open 之后刷新父页面
wuhen8的专栏
11-25 1037
在子窗口中，close之前加上一句话： window.opener.location.href=window.opener.location.href; window.close();
JavaScript 根据数组对象的某个 指定属性 分组合并，并累加金额
最新发布
zhangyao940330的博客
12-15 164
item } 浅拷贝原对象的所有属性（如 id、name），合并时仅更新金额，其他属性保留第一个分组对象的值（若需保留所有属性，可修改为数组存储，如 name: [‘苹果’, ‘香蕉’]）。分组逻辑：用 Map 存储分组，键为 groupKey 的值（如 ‘水果’），值为合并后的对象。Map 比普通对象更安全（避免键名冲突，支持数字 / 对象等类型的键）。缺失金额或非数字（如 undefined、‘abc’）视为 0。字符串金额（如 ‘8’）自动转为数字；扩展需求：保留分组内所有非金额属性。
window.open打开新页面pinia失效
06-26
在使用 `window.open` 打开新页面时，Pinia 状态管理失效的原因是由于新页面是在一个全新的浏览器上下文中加载的，该上下文并不共享原页面的 `sessionStorage` 或 `localStorage` 中的数据（除非明确配置了持久化策略）。Pinia 默认情况下并不会将状态持久化到存储介质中，而是依赖于内存中的响应式机制。 ### 解决方案一：使用 pinia-plugin-persistedstate 插件实现状态持久化 可以通过集成 `pinia-plugin-persistedstate` 插件，将 Pinia 的状态自动同步到 `sessionStorage` 或 `localStorage` 中。这样即使通过 `window.open` 打开的新页面也可以访问到相同的状态数据。 插件的基本配置如下： ```javascript import { createPinia } from 'pinia'; import persistedState from 'pinia-plugin-persistedstate'; const pinia = createPinia(); pinia.use(persistedState); ``` 然后在定义 store 时指定使用哪种存储方式和需要持久化的字段： ```javascript export const useMyStore = defineStore('myStore', { state: () => ({ data: null, }), persist: { key: 'my-store-key', storage: sessionStorage, // 或 localStorage paths: ['data'], }, }); ``` 这样，在页面刷新或通过 `window.open` 打开的新页面中都可以读取到最新的状态数据 [^1]。 --- ### 解决方案二：手动传递状态参数 如果不想使用插件，也可以考虑在调用 `window.open` 时将当前状态序列化为 URL 参数或通过 postMessage API 发送到新窗口。 #### 使用 URL 参数传递状态 ```javascript const currentState = encodeURIComponent(JSON.stringify(useMyStore().$state)); const url = `/new-page.html?state=${currentState}`; window.open(url, '_blank'); ``` 在新页面中解析 URL 并恢复状态： ```javascript const urlParams = new URLSearchParams(window.location.search); const savedState = JSON.parse(decodeURIComponent(urlParams.get('state'))); useMyStore().$patch(savedState); ``` 这种方式适用于状态较小的情况，且需要注意安全性问题 [^2]。 --- ### 解决方案三：使用全局事件通信（postMessage） 对于更复杂的状态同步需求，可以使用 `window.postMessage` 在两个页面之间进行通信。 主页面发送消息： ```javascript const newWindow = window.open('/new-page.html', '_blank'); newWindow.postMessage(JSON.stringify(useMyStore().$state), '*'); ``` 新页面监听消息并恢复状态： ```javascript window.addEventListener('message', (event) => { const receivedState = JSON.parse(event.data); useMyStore().$patch(receivedState); }); ``` 此方法避免了暴露敏感数据在 URL 中的问题，并支持更大体积的状态传输 [^3]。 --- ### 总结与建议 - 如果希望简化开发流程并保证状态一致性，推荐使用 `pinia-plugin-persistedstate` 实现自动持久化。 - 对于临时性的状态传递，可采用 URL 参数或 `postMessage` 进行显式传递。 - 注意跨域场景下的限制，确保两个页面同源或已正确处理跨域通信权限。 ---
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值