zoukankan      html  css  js  c++  java
  • JS中关闭新页面时刷新父页面指定方法

    一、页面执行流程说明:

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

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


    二、实现步骤:

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

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

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


    三、代码:

    父页面 a.html

    1. <head>
    2. <script>
    3. function f1(){
    4. window.open("b.html","","width=800px,height=600px");
    5. }
    6. </script>
    7. </head>
    8.  
    9. <body>
    10. <button οnclick="f1()">点我打开新窗口</button>
    11. </body>

    子页面 b.html

    1. <head>
    2. <script>
    3. window.onbeforeunload = function() {
    4. window.opener.location.reload();
    5. };
    6. </script>
    7. </head>
    8.  
    9. <body>
    10. <h2>这是b.html</h2>
    11. </body>

    四、测试

    1.打开a.html


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




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

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

  • 相关阅读:
    八、分组
    七、select使用
    六、SQL基础应用
    五、修改MySQL密码
    side Effect
    js函数式编程
    React生命周期
    Portals
    git使用技巧
    函数式编程
  • 原文地址:https://www.cnblogs.com/lijl/p/14235161.html
Copyright © 2011-2022 走看看