postMessage源IFrame [英] postMessage Source IFrame

问题描述

我正在使用带有跨域iframe的网站，使用postMessage将其调整为正确的高度。我唯一的问题是确定哪个iframe有哪个高度。我目前设置的方式是，当一个iframe将其高度发送到父级，所有的iframe的高度都会改变。

I'm working on a website with cross-domain iframes that are resized to the correct height using postMessage. The only problem I'm having is identifying which iframe has which height. The way I've currently got it set up is that when one iframe sends its height to the parent, all the iframes' heights are changed.

父级：

var eventMethod = window.addEventListener ? "addEventListener" : "attachEvent";
var eventer = window[eventMethod];
var messageEvent = eventMethod == "attachEvent" ? "onmessage" : "message";

eventer(messageEvent, function(e) {
    $('iframe').height(e.data);
}, false);

Iframe：

var updateHeight = function() {
    if(window.parent) {
        window.parent.postMessage($('.widget').outerHeight(), '*');
    }
};

有什么方法可以识别哪个iframe发送了 $ c> event？

Is there some way to identify which iframe sent the message event?

推荐答案

我找到了解决方案：如何在JavaScript窗口和框架之间共享数据

父级：

var frames = document.getElementsByTagName('iframe');
for (var i = 0; i < frames.length; i++) {
    if (frames[i].contentWindow === event.source) {
        $(frames[i]).height(event.data); //the height sent from iframe
        break;
    }
}

这篇关于postMessage源IFrame的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！