Javascript关闭window

Question

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

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

在页面 B 中，我有一个脚本，一旦用户不再查看它，它会自动关闭 tab/window。我的脚本如下所示：

<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.

因为我实际上是打开 window 的那个人，有没有办法让它工作？

Answer 1

window 必须使用 JavaScript 的 window.open(), not with a <a href="..." target="..."> link. See window.close() 文档打开以获得更多详细信息。

例如，一种方法是侦听 link 上的 click 事件，阻止默认操作，然后使用 [= 显式打开 window 38=]:

<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>

虽然这可能存在问题：

您的用户可能已将他们的浏览器配置为阻止打开新的 windows。
如果用户通过单击您的 link 以外的其他方式访问 page_b.php，关闭 window 也将不起作用。您必须明确测试 window 是否被您的其他 window 使用 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关闭window

Javascript close window

javascript

php

tabs

dom-manipulation

dom-events