小编Tim*_*Tim的帖子

我有一个父页面,可以在模态中加载iFrame.我希望iFrame和包含模式根据内容高度动态调整大小.

虽然我可以在父页面加载时使用postMessage将子页面的高度发送到父页面,但高度始终是错误的,因为模态还不可见.

一旦模态实际从display:none变为display:block,我怎样才能发送高度？

这就是我现在正在做的事情:

父页面

function receiveMessage(e) {
    // Check to make sure that this message came from the correct domain.
    if (e.origin !== "http://www.example.com")
        return;

    // Update the div element to display the message.
    alert("Message Received: " + e.data);
    var pixels = e.data;
    pixels +=32;
    console.log(pixels);
    $('#modal').css('height', pixels+'px');
    $('#iframe').css('height', pixels+'px');

}

儿童页面

  function sendHeight () {
    var containerHeight = $('#main_container').height();
    alert("Height " + containerHeight);
    parent.postMessage(containerHeight, 'http://www.example.com');
  };