window.open打开子窗口回调父窗口函数

window.open打开子窗口回调父窗口函数

1. 父页面JS

<script>
        var btn = document.getElementById('btn')
        btn.addEventListener('click', function () {
            window.open('子页面.html', '','width=600,height=300')
        })
        
        // 监听子窗口回传数据01
        window.addEventListener('message', function (data) {
            alert(data.data)
            console.log(data.data);
        })
        /** 监听子窗口回传数据02
        window.onmessage = function（event）{
            alert(event.data)
            console.log(event.data);
		}
		*/
    </script>

2. 子页面JS

<script>
		<!- 子窗口js ->
        var btn = document.getElementById('btn')
        btn.addEventListener('click', function () {
            window.opener.postMessage('这是回传给父页面的参数', '*');
            window.close()
        })
</script>