場面想定
サブウィンドウでは閉じる以外の操作が出来ない(リンク等はない)
イベントは全て親ウィンドウで発火、サブウィンドウからイベントを呼ぶことは出来ない
jQuery使用可能環境
処理
$('.link').on('click', function ( e ) {
e.preventDefault();
var win = window.open(this.href,'window','width=500,height=500');
$(win).on('load', function () {
console.log('開いたよ');
$(win).on('unload', function () {
console.log('閉じたよ');
});
});
});
注意点
注意点はunload
をバインドするタイミングです。
サブウィンドウを開いてすぐにバインドしてしまうと、開いた直後にunload
が呼ばれてしまいます。
上記対策としてif ( win.closed )
の分岐を入れてみましたが、サブウィンドウを閉じた時の動きが怪しく、うまく動きませんでした。
(この原因の調査はしっかりしていません。)
なので、サブウィンドウが開いてからunload
をバインドするようにしています。
これで意図した通りに動きました。
unloadだけで処理したい場合
if ( win.closed )
を使用してできました。
$(win).on('unload', function () {
setTimeout(function () {
if ( !win.closed ) return;
console.log('閉じたよ');
},10);
});
サブウィンドウが閉じるまでの時間として、10msの遅延をすれば良さそうです。
遅延が気持ち悪ければload
の中でunload
をバインドすると良いでしょう。