Javascriptでウェブページのタブを閉じたい 【できる場合、できない場合】

スポンサーリンク

Javascariptでウェブページのタブを閉じるコードは、ブラウザ(あるいはバージョン)によって挙動が違います。ここで検証できます。

スポンサーリンク

セキュリティによる制約

まず、基本的にはJavascriptでは、コードから開いたウィンドウは閉じることができるものの、ユーザーが開いたウィンドウは閉じられません。これは、セキュリティのためです。

つまり、リンクで表示したページの場合、「閉じる」ボタンを作ってタブを閉じることはできない、ということになります。

参考のため、いろいろ試した結果のコードを置いておきます。

このページを新しいタブで開いてみる

【 開く 】

ここで、開いたタブなら閉じられる。

window.closeメソッド

以下、window.closeメソッドの動作を実際に検証してみましょう。

window.close();

以下のコードを実行するボタンのHTML

<input type="button" onclick="window.close();" value="window.close()">

いったんopenしてからcloseする

そこで、一度「空白ページ」として開いてから、閉じるコードがこちら。

window.open('about:blank', '_self').close();

Chromeでは、以下のコードが有効なようです。ただ、これはバグなのでいずれは修正されることが予想されます。

window.open('', '_self').close();

このパターンは?

<a href="javascript:void(0);" onclick="window.close();return false;">
【 閉じる [X] 】
</a>
閉じるボタン

追記:タグ「a」の属性「href」の URL プロトコルが無効です(2020年9月9日)

アンカーリンクによるボタンはAMPのエラーが表示されたので、いったん削除して画像に差し替えました。

AMP > タグ「a」の属性「href」のURLプロトコルが無効です。

 AMPエラーになってしまった図

こちらもどうぞ

タイトルとURLをコピーしました