Question

我在page_a.php中有一个链接，该链接使用target="_blank"在新标签页中打开。

 <a href="page_b.php" target="_blank">Open Page B</a>

在页面B中，我有一个脚本，一旦用户不再查看它，它将自动关闭该选项卡/窗口。我的脚本如下：

<script type="text/javascript">
    function handleVisibilityChange() {
      if (document.visibilityState == "hidden") {
        window.close();
        console.log("hidden");
      } else {
        console.log("shown");
      }
    }
    document.addEventListener('visibilitychange', handleVisibilityChange, false);
</script>

所以我有

 localhost/test/page_a.php //loads jQuery
 localhost/test/page_b.php //doesn't load jQuery

在page_b.php上，我收到警告：Scripts may close only the windows that were opened by it.

由于我实际上是打开窗户的人，有没有办法使这项工作呢？

Answer 1

必须使用JavaScript的window.open()而不是<a href="..." target="...">链接打开窗口。有关更多详细信息，请参见window.close()文档。

例如，一种方法是侦听链接上的click事件，阻止默认操作，然后使用JavaScript显式打开窗口：

<script type="text/javascript">
  // wait for the DOM to have loaded
  document.addEventListener( 'DOMContentLoaded', function( e ) {
    let link = document.querySelector( 'some selector to get the proper link element' );
    link.addEventListener( 'click', function( e ) {
      // prevent window opening regularly
      e.preventDefault();
      // explicitly open with JavaScript
      window.open( this.href, 'MyNewWindow' );
    } );
  } );
</script>

这可能有问题，

您的用户可能已配置其浏览器，以防止打开新窗口。
如果用户通过其他方式（而不是通过单击链接）访问page_b.php，则关闭窗口也不起作用。您必须使用window.opener来明确测试该窗口是否被其他窗口打开：
```
<script type="text/javascript">
  /*
     ...
  */
  // if this window has a reference to the window that opened this window
  if( window.opener ) {
    document.addEventListener('visibilitychange', handleVisibilityChange, false);
  }
</script>
```
但是您可以在文档中看到，window.opener也有其自身的问题。

Javascript关闭窗口

1 个答案: