Q&A
「試したこと」部分、もう少しコードの全体がわかるような提示の仕方でお願いします。
質問失礼致します。
現在、JavaScriptにて以下処理を実装しようとしています。
１、親画面から子画面を開く
２、子画面を閉じる
３、子画面が閉じたことにより、親画面の関数が実行される
javascript
1var win = window.open('', 'child', 'height=100,width=100'); 2win.write('<html><head>'); 3win.write('<script type="text/javascript">'); 4win.write(`<!-- 5function clickBtn(){ 6 window.close(); 7} 8-->`); 9win.write('</script></head><body>'); 10win.write('<input type="button" value="閉じる" onClick="clickBtn()">'); 11win.write('</body></html>');
３の子画面が閉じる→親画面のイベント（関数）が走り出す、というところで躓いており、どうにか子画面が閉じたことを親画面側で検知させる方法を探しております。
####試したこと
以下のように、子画面が開いた後、子画面が閉じられた場合は検知する処理を書こうとしたのですが、以下ではうまくいきませんでした。
$(win).on('load', function(){ $(win).on('unload', function () { console.log("Hello world"); }); });
有識者の方、ぜひお力をお借りできれば幸いです。
この書き方だと<script>で囲われてないので子画面のscript実行されないのでは。
``
win.write(`<!--
function clickBtn(){
window.close();
}
-->`);
``
コメントありがとうございます。
大部分を省きすぎて必要なところまで省いてしまいました。失礼しました。コードを追加致しました。
試したこと部分は「試したこと」見出しで分けるために上記コードと分断して書いてはいますが、そのまま他コードなど挟むことなく上記コードにくっつけて一続きに書かれています。他にコードはありません。
回答4件
0
親側でイベント設定してやればよいのでは？
javascript
1 2let childfunc = ()=>{ 3 console.log("child is closing"); 4}; 5win = window.open(""); 6$(win).on("unload", childfunc); 7
投稿2019/01/25 06:04
総合スコア5572
コメントありがとうございます。
こちらの方法でも無事期待通りの挙動を確認することが出来ました！ありがとうございます。
追記.これはまた違うお話になるかと思いますが、一応…
$(win).on("unload", childfunc);後にデベロッパーツールでchildfunc内でブレークポイントを張り処理を止めると、親画面がブラウザエラーとなりました。
なぜかは分かりませんが…。処理を止めなければ問題なく動作しました。
0
ベストアンサー
javascript
1<script> 2function clickBtn(){ 3 var nwin = window.open('', 'child', 'height=100,width=100'); 4 with(nwin.document){ 5 writeln('<html><head>'); 6 writeln('<script>'); 7 writeln('window.onbeforeunload=function(){'); 8 writeln('opener.alert(1)'); 9 writeln('return 1;};'); 10 writeln('function clickBtn(){this.close();}'); 11 writeln('</'+'script></head><body>'); 12 writeln('<input type="button" value="閉じる" onClick="clickBtn()">'); 13 writeln('</body></html>'); 14 } 15 16}; 17</script> 18<input type="button" value="開く" onClick="clickBtn()"> 19
投稿2019/01/25 06:38
総合スコア118405
コメントありがとうございます。
上記のonbeforeunloadイベントを使用し無事期待通りの挙動が確認できました。
（都合上、親画面から子画面closeを検知するようにしました）
```
var win = window.open('test.html', 'child', 'height=100,width=100');
win.onbeforeunload = function () {
//処理
}
```
ありがとうございました！
onpagehideを利用すれば、確認メッセージなしで閉じられます
0
子画面から親画面のメソッドをキックする方法があるようです。
window.close()の前でキックしてやると良いです。
ただ、そのままChromeで実行するとcross-originエラーが出ますけど（IE11では動きます）
投稿2019/01/25 06:20
総合スコア80896
コメントありがとうございます。
window.openerで親画面関数を呼び出す方法も試していたのですが、is not functionエラーで呼び出せませんでした。cross-originエラーが直接関係しているのでしょうか…
たぶん呼び出し方ではないでしょうか。
cross-originについては確かWebサーバー上で実行すれば問題ないはずです（なので「そのまま実行すると」と書きました）
0
Javascript
1function rip(win){ 2 console.log(win+' is dead'); 3} 4if(!window.opener) { 5 window.open('test.html', 'child'); 6} else { 7 window.onbeforeunload = function(){ 8 window.opener.rip(this.name); 9 } 10}
投稿2019/01/25 06:11
総合スコア5405
あぁ、これChromeで実行するならローカルファイルではなく、一度サーバにアップロードして動作確認してくださいね。
ファイル名はtest.htmlで
コメントありがとうございます。
window.onbeforeunloadにより無事挙動が確認できました！ありがとうございます！
あなたの回答
tips
プレビュー
