JavaScript刷新父页面方法汇总详解

作者:小括号

时间:2026-10-23

浏览:566

本文汇总了JavaScript中刷新父页面的6种常见场景及对应代码。涵盖iframe子页面刷新、window.opener刷新、open打开窗口刷新、showModalDialog刷新、Layer弹窗刷新及指定iframe刷新。提供完整JS代码示例,帮助开发者快速解决页面更新问题。

文章目录

iframe子页面刷新父页面

当页面包含iframe时,若需在子iframe中刷新父页面,可使用parent对象定位父窗口并调用location.reload()方法。


<script language=JavaScript> 
  parent.location.reload(); 
</script>

弹出子页面刷新父页面

通过window.open()打开的子窗口,若需刷新其父页面,可通过window.opener获取父窗口引用,并调用location.reload()实现刷新。


<script language=JavaScript> 
  window.opener.location.reload(); 
</script>

子窗口刷新父窗口

在子窗口中,若需刷新打开它的父窗口,可使用self.opener获取父窗口对象,随后调用location.reload()完成刷新操作。


<script language=JavaScript> 
  self.opener.location.reload(); 
</script>

刷新以open()方法打开的窗口

对于通过window.open()方法打开的新窗口,若需刷新父页面,除了reload()外,也可通过重新赋值window.opener.location.href来触发页面重载。


<script language=JavaScript> 
  window.opener.location.href=window.opener.location.href; 
</script>

刷新以showModalDialog()方法打开的窗口

针对以window.showModalDialog()方式打开的模态对话框,刷新父页面需调用window.parent.dialogArguments.document.execCommand('Refresh')方法。


<script language="javascript"> 
  window.parent.dialogArguments.document.execCommand('Refresh'); 
</script>

Layer弹窗中刷新指定iframe

在使用Layer弹窗库时,若需刷新当前页所在的父页面iframe,可通过parent.document获取所有iframe元素,遍历查找目标iframe(如包含'table.jsp'的iframe),并调用contentWindow.location.reload(true)强制刷新。


var iframes= parent.document.getElementsByTagName('iframe');
for(var i=0;i<iframes.length;i++){
  var src=iframes[i].contentWindow.location.href;
  console.log( src);
  if(src.indexOf("table.jsp")!=-1){
    console.log( "刷新:"+src);
    parent.document.getElementsByTagName('iframe')[i].contentWindow.location.reload(true);
  }
}

parent.document.getElementById('my_iframe').contentWindow.location.reload(true);

以上即为JavaScript中刷新父页面的多种实现方式,可根据具体场景选择合适的方法。

实用工具推荐

电子包浆

绿化、压缩、噪点和虚拟水印,自由调节做旧程度。

使用 ›
图片压缩

选择画质和输出格式,预览压缩前后的大小。

使用 ›
相关文章