別ウインドウから別ウインドウを開くと同時に、親だった別ウインドウを閉じる


この記事は2012年11月に掲載されたものです。
状況が変わったり、リンク先が変わっている可能性があります。

別ウインドウで他サイトに遷移する際、別ウインドウに注意書きを表示し、同意した場合のみ遷移させたいことがある。

同一ウインドウ内で遷移させてもいいが、同意ボタンを押すとさらに別ウインドウが開き、注意書きのウインドウが同時に閉じるとインタラクティブに見える。遷移する際、別ウインドウをリサイズすることも出来る。あまり使う機会はないと思うが、備忘録としてJavaScriptを記録しておく。

/* 注意書きを表示するウインドウ */

<html>
<head>
<script type="text/javascript">
<!--
function newURL(){
window.open('http://example.com/');
top.window.opener = top;
top.window.open('','_parent','');
top.window.close();
}
-->
</script>
</head>

<body>
<a href="javascript:newURL()">同意して遷移する</a></p>
</body>
</html>

タグブラウザでは、上記だと別ウインドウではなく別タグが開くものがある。タグブラウザでも強制的に別ウインドウにしたい場合は、window.openメソッドの第3パラメータを書くとよい。ただし、第3パラメータを書く場合は、省略せずに全部書かないとメニューバーやスクロールバーが表示されない。リサイズの場合も同じである。

/* リサイズやタグブラウザ対応の場合 */

<html>
<head>
<script type="text/javascript">
<!--
function newURL(){
window.open('http://example.com/','',
'width=1024,height=768,toolbar=1,menubar=1,location=1,scrollbars=1,resizable=1');
top.window.opener = top;
top.window.open('','_parent','');
top.window.close();
}
-->
</script>
</head>

<body>
<a href="javascript:newURL()">同意して遷移する</a></p>
</body>
</html>