Question

我已按照here和here的说明操作，但无法正确实施easyXDM以自动调整iframe的高度。

在带有iframe（host.html）的页面上，我可以看到我导入的内容（otherdomain.html），但iframe的高度比内容短得多，并且高度不会改变。不幸的是，这是在我无法链接到的开发网站上。

otherdomain.html具有在点击时展开的元素，因此我需要iframe展开和收缩，因为页面的内容会这样做。

有人能告诉我，我做错了吗？这些是我正在使用的两个不同的域/服务器。这是我第一次设置一个套接字或做过这样的事情 - 我没有在控制台中看到任何错误，但我对它告诉我的内容没有多大意义。

这是一个类似的问题，但没有回答：IFrame resizing with easyXDM

以下是我在iFrame页面上的内容：

        <style type="text/css">
            div#embedded iframe {
                width: 725px;
            }
        </style>  
        <script src="../js/easyXDM.debug.js" type="text/javascript"></script> 
        <script type="text/javascript" language="javascript">
        new easyXDM.Socket({
            remote: "http://lcoawebservices.com/careers/resize_intermediate.html?url=job-postings.php",
            container: "embedded",
            onMessage: function (message, origin) {
                var settings = message.split(",");
                this.container.getElementsByTagName("iframe")[0].style.height = settings[0];
                this.container.getElementsByTagName("iframe")[0].style.width = settings[1];
            }
        });

        </script>
        <div id="embedded"></div>

以下是我在resize_intermediate.html上的内容：

                    <script type="text/javascript" src="../scripts/easyXDM.debug.js">
                </script>
                <script type="text/javascript">
                    var iframe;
                    var socket = new easyXDM.Socket({
                        swf: "../scripts/easyxdm.swf",
                        onReady: function(){
                            iframe = document.createElement("iframe");
                            iframe.frameBorder = 0;
                            document.body.appendChild(iframe);
                            iframe.src = easyXDM.query.url;
                        },
                        onMessage: function(url, origin){
                            iframe.src = url;
                        }
                    });
                    //Probe child.frame for dimensions.
                    function messageBack(){
                        socket.postMessage ( iframe.contentDocument.body.clientHeight + "," + iframe.contentDocument.body.clientWidth); 
                    };

                    //Poll for changes on children every 500ms.
                    setInterval("messageBack()",500);
                </script>
                <style type="text/css">
                    html, body {
                        overflow: hidden;
                        margin: 0px;
                        padding: 0px;
                        width: 100%;
                        height: 100%;
                    }

                    iframe {
                        width: 100%;
                        height: 100%;
                        border: 0px;
                    }
                </style>

在我导入的页面底部我放置了这个：

        <script type="text/javascript">
            window.onload = function(){
                parent.socket.postMessage(document.body.clientHeight || document.body.offsetHeight || document.body.scrollHeight);
            };
        </script>

easyXDM iFrame自动高度失败

0 个答案: