为什么 postMessage 脚本在 IE8 中不起作用？答案

【问题标题】：Why is postMessage script not working in IE8?为什么 postMessage 脚本在 IE8 中不起作用？
【发布时间】：2013-02-05 17:27:07
【问题描述】：

经过广泛研究，这似乎应该可以工作，但在 IE8 中，letsgo 函数永远不会被调用...有什么帮助吗？

<script type="text/javascript">
    function resizeCrossDomainIframe() {        

        if (window.addEventListener) {
            window.addEventListener('message', letsgo, false);
        } else if (window.attachEvent) {
            window.attachEvent('onmessage', letsgo);
        }
    }
    function letsgo(event) {
        var iframe = document.getElementById('my_iframe');
        if (event.origin !== 'http://mysite.com') return; // only accept messages from the specified domain
        if (isNaN(event.data)) return; // only accept something which can be parsed as a number
        var height = parseInt(event.data) + 32; // add some extra height to avoid scrollbar
        iframe.height = height + "px";
    }
</script>
    <iframe src='http://mysite.com/products/default.aspx?iframe=true&partnerid=222&site=localhost:62014' frameborder="0" width="100%" scrolling="auto" style="min-height: 750px; min-width: 600px; background-color: #fff;"  id="my_iframe" onload="resizeCrossDomainIframe();">
    </iframe>

【问题讨论】：

您将<!DOCTYPE html> 作为页面的第一行？
是的，我愿意...我想我应该补充一点，这在 FF、Chrome 和 IE9 中效果很好。子 iframe 页面也像这样调用 postMessage：跨度>
似乎在 MSDN 的每个示例代码中都有 event.domain 而不是 event.origin，尽管这不是第一次在 MSDN 的示例中遇到错误。

标签： javascript iframe postmessage

【解决方案1】：

我明白了，一定是比赛条件。我拿出了onload。

<script type="text/javascript">


        if (window.addEventListener) {
            window.addEventListener('message', letsgo, false);
        } else if (window.attachEvent) {
            window.attachEvent('onmessage', letsgo);
        }

    function letsgo(event) {
        var iframe = document.getElementById('my_iframe');
        if (event.origin !== 'http://mysite.com') return; // only accept messages from the specified domain
        if (isNaN(event.data)) return; // only accept something which can be parsed as a number
        var height = parseInt(event.data) + 32; // add some extra height to avoid scrollbar
        iframe.height = height + "px";
    }
</script>
    <iframe src='http://mysite.com/products/default.aspx?iframe=true&partnerid=222&site=localhost:62014' frameborder="0" width="100%" scrolling="auto" style="min-height: 750px; min-width: 600px; background-color: #fff;"  id="my_iframe" >
    </iframe>

【讨论】：