Help us understand the problem. What is going on with this article?

jsで子ウインドウを開き、子の値を親に返す手段

More than 3 years have passed since last update.

やりたかったこと

①ブラウザから別ウインドウを開く
②別ウインドウのある要素がクリックされたときにその値を親ウインドウに返す

結果的に子側でwindow.openerを使えば親の関数が呼べる。

(同一ドメインでしか試していません)

簡単な見本

親ウィンドウ側

<button onclick="openNewWindow()">
    Open
</button>

<script type="text/javascript">
    function openNewWindow() {
        window.open(
            'http://~~~~~', //移動先
            'pop',  //新規ウィンドウで開く
            'width=800, height=480' //サイズ指定
        );
    }

    function onCallBack(data) {
        console.log(data); //hoge
    }
</script>

呼び出す子ウィンドウ側

<button onclick="closeWindow()">
    Close
</button>

<script type="text/javascript">
    function closeWindow() {
        window.opener.onCallBack('hoge');
        window.close();
    }
</script>

ちなみに

子側からwindow.postMessageとかも使ってみたけどうまくいかなかったのは何故なのか
postMessage使ってる方いたらご教授願いたい。

smith-30
engineer elmをやりたいと思っている
elm-jp
主に日本で活動する Elm 利用者のコミュニティです。
https://elm-lang.jp
Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away