javascript - 使用 jQuery 事件调整 contentWindow 高度

Question

这是我目前为止所拥有的，使用这篇文章:

Make iframe automatically adjust height according to the contents without using scrollbar?

问题是函数 resizeIframe() 在再次调用后似乎没有任何改变。帧大小不变。

这是我的完整代码:

function resizeIframe(obj) {
    obj.style.height = obj.contentWindow.document.body.scrollHeight + 'px';
}

$(document).ready(function() {

// change iframe based on drop down menu //

    $('#dropdown').click(function(){
        $('iframe').slideUp("slow");
        $('iframe').attr('src', 'preview.php?frame=off&sid='+$(this).val());
        resizeIframe(document.getElementById('previewframe'));
        $('iframe').slideDown('slow');
    });
}

这是我的HTML

<iframe id="previewframe" src="preview.php?frame=off&sid=1" style="width: 100%; overflow-x: hidden; overflow-y: scroll" onload='javascript:resizeIframe(this);'>
</iframe>

---

请在回答前阅读此修改内容

编辑:所以我离成功又近了一些，但我还没有成功。

所以在 iframe 源 html 中，我将其嵌入到 body 的底部:

<script type="text/javascript">
    parent.AdjustIframeHeight(parseInt(document.getElementById("body").scrollHeight));
</script>

然后我的主文件中有以下内容:

<iframe name="previewframe" id="previewframe" src="preview.php?frame=off&sid=1" style="width: 100%; overflow-x: hidden; overflow-y: scroll;">
</iframe>
<script type="text/javascript">
    function AdjustIframeHeight(i) {
        alert("CHANGING: " + parseInt(i));
        document.getElementById('previewframe').style.height = parseInt(i) + "px";
        alert("Current value: " + document.getElementById('previewframe').style.height);
    }
</script>

所以一切正常，正确的值被发送到警报，第二个警报发回最初传递的值，但实际框架高度没有改变。

真正奇怪的是，如果我打开控制台，然后手动输入:

document.getElementById('previewframe').style.height = "800px";

它将完美地工作。所以这让我相信浏览器只需要以某种方式更新设置的高度。

Answer 1

我遇到了这个问题。以下是我如何让它发挥作用的。

myiframe.css('visibility', 'hidden' );
myiframe.css('height', '1px' );
myiframe.css('height', myiframe.contents().height() ); // get the size of the iframe content height.
myiframe.css('visibility', 'visible' );

我从这个 link 得到了隐藏它并使其可见的想法，但这并不能单独工作。我从 document.getElementById(id).style.height 切换到 myiframe.css() 并且它起作用了。