js关闭当前页面刷新父页面

版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
本文链接:https://blog.csdn.net/u010999809/article/details/76401155

一、页面执行流程说明:

1.点击父页面a.html的“点我打开新窗口”按钮-->弹出新窗口(b.html)

2.关闭弹出的新窗口b.html-->刷新父页面a.html


二、实现步骤:

要点:1.给按钮的点击事件编写函数f1(),用于弹出新窗口   window.open(新窗口的url,"",窗口参数)

2.给弹出的新窗口添加对关闭事件的监听(window.onbeforeunload),通过该监听来实现父页面刷新

说明:要点2中的实现参考了qq_26676207转载的js关闭当前页面刷新父页面


三、代码:

父页面 a.html

<head>
	<script>
		function f1(){
			window.open("b.html","","width=800px,height=600px");
		}
	</script>
</head>
	
<body>
	<button οnclick="f1()">点我打开新窗口</button>
</body>

子页面 b.html

<head>
	<script>
		window.onbeforeunload = function() {  
			window.opener.location.reload(); 
		};
	</script>
</head>
	
<body>
	<h2>这是b.html</h2>
</body>

四、测试

1.打开a.html


2.点击“点我打开新窗口”按钮




3.点击弹出窗口右上角的“关闭”按钮

这时我们看到控制台的“网络”部分捕捉到了一个新的页面请求,说明父页面(a.html)被刷新了




展开阅读全文

没有更多推荐了,返回首页