首页 > 代码库 > html5 xdm 页面之间的通信

html5 xdm 页面之间的通信

2024-08-20 10:30:56   217人阅读

<!-- 这个是父页面xdm.html -->
<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>XDM通信</title>
    </head>
    <body>
        <iframe id="iframeId" src="http://127.0.0.1:8020/avalon/iframe.html" width="100%" height="600px"></iframe>
        <script type="text/javascript">
            window.addEventListener(‘load‘ , function(){
                var iframeWindow = document.getElementById(‘iframeId‘).contentWindow;
                
                iframeWindow.postMessage("滚犊子" , "http://127.0.0.1:8020/avalon/iframe.html");
            });
        </script>
    </body>
</html>
<!-- 这个是子页面，iframe.html -->
<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
    </head>
    <body onload="aaaa()">
        <script type="text/javascript">
        function aaaa(){
            window.addEventListener(‘message‘ , function(event){
                console.log(event);
                alert(event.data);
            },false)
        }
        </script>
    </body>
</html>

 

html5 xdm 页面之间的通信


联系
我们