Javascriptで親画面または子画面が閉じられたら孫画面も閉じるようにするには

Question

親画面(test1.html)⇒子画面(test2.html)⇒孫画面(test3.html)

親画面または子画面が閉じられた再に、孫画面も閉じられるように
Javascriptで実装するにはどうしたらいいでしょうか？

・親画面javascript

var subWindow
$("[id^=id1]").click(function () {
	subWindow = window.open("test2.html", "test2");//子画面を開く
    subWindow.focus();
});
// 親画面CLOSE処理
    window.addEventListener('unload', function (event) {
        if (typeof subWindow != "undefined") {
            subWindow.close();//親画面を閉じたら、子画面も閉じる
        }
    });

・子画面javascript

var subWindow2
$("[id^=id2]").click(function () {
	subWindow2 = window.open("test3.html", "test3");//孫画面を開く
    subWindow2.focus();
});

どなたかご教授を宜しくお願いします。

Answer 1

test2.htmlにもtest1.htmlと同様の処理を書いておくだけでは？

Comments

[yambejp]

この手の処理は擬似的なモーダルで開くことをおすすめします
現状のようなモードレス処理の場合ページの依存関係を
コントロールするのも限界があります

Answer 2

簡単に説明すると

window.openの値は変数にとっておいて
親が終了する際、子を閉じる
(親がwindow.openしているので子の値はあるはず)

そうすると子が終了するので
終了する際孫の値から孫画面を閉じる
(子がwindow.openしているので孫の値はあるはず)

という流れで閉じていく事ができます。
ソ－スを見る限りでは子画面での

window.addEventListener('unload', function (event) {
  if (typeof subWindow2 != "undefined") {
    subWindow2.close();
  }
}

だけでよさそうですね

Comments

[kumakumatan]

ご回答ありがとうございます。
実装してみたのですが、孫画面を開くクリック処理を子画面からすると、
孫画面を開こうとするのですが、孫画面が閉じてしまいます。
上手くいかないです。
ご教授宜しくお願いします。

[kuma_kuma_]

> 孫画面を開くクリック処理を子画面からすると、
> 孫画面を開こうとするのですが、孫画面が閉じてしまいます。
「子画面から孫画面を開こうとすると孫画面が閉じる。」
もともとそこはできていなかったのですか？
多分ブラウザのセキュリティ機能(ポップアップブロック機能)が働いていませんか？
一応ブラウザにもよりますが対象外に設定すれば開きます。

ただまだ実装されていないのであれば、他の方が書かれている通り「モーダル画面」での処理をオススメします。

[kumakumatan]

ダイアログで開く孫画面にて「iframe」タグを利用しています。
孫画面を開く再も何故か、「window.addEventListener('unload', function (event)」
を通過してしまいます。

[kuma_kuma_]

親 ＞子 ＞ 孫 > ひ孫(孫内iframe) ですか？
iframeのwindowに対して「window.addEventListener('unload', function (event)」している認識でよいのですよね？
始めiframe上に空のページ(about:blank)が表示されていて、その後表示されたいURLが読み込まれていませんか？

Answer 3

孫画面で[iframe]タグを利用していた為、子画面から開こうとするときに、
「window.addEventListener('unload', function (event) {」が通過してしまう
ために、閉じるイベントが意図しない結果になってしまいました。
そこで、孫画面側(test3.html)のjavascriptで

//ページ読込時
function pageLoad() {
    setInterval("surveillance()", 1000);//1秒毎に監視
}

//監視スクリプト
function surveillance() {
    if (!window.opener || window.opener.closed) { // メインウィンドウの存在をチェック
        open('about:blank', '_self').close();    //一度再表示してからClose
        return false; //以降の処理を中断
    }
}

として、子画面が開かれているかを孫画面側から1秒毎に監視することで、
実装できました。

ありがとうございました。