Javascript 调整IFRAME的大小以删除滚动条

我的页面上有一个iframe，每次内容更改时都要调整它的大小，这样就没有滚动条了。在不更改URL的情况下，框架的内容会频繁更改。我希望所有的内容从帧显示所有的时间，没有屏幕闪烁，而帧的大小调整。父级和帧位于同一个域上

现在，每当我认为帧大小发生变化时，我调用一个函数来设置帧大小。如何在不到处调用此函数的情况下执行此操作

---

如果有帮助的话，我正在使用angularJS。

您可以通过[iframe]

.contentWindow.document.body.offsetHeight

获得iFrames内容高度。如果您不知道内容大小何时更改，则必须使用

setInterval（）

手动检查，尝试此操作，在事件侦听器中调用重新调整大小函数，当iframe加载时，将触发此操作

var iframe = document.getElementById('myIframe');
    var resizeFunction= function() {$("#myIframe").css({
       height: iframe.$("body").outerHeight()
    });};
    if(iframe.addEventListener){
        iframe.addEventListener('load', resizeFunction, true);
    }else if(iframe.attachEvent){
        iframe.attachEvent('onload',resizeFunction);
    }

---

这是我在我的一个网站上使用的功能。我修改了代码，将其放入指令中

注意：在iframe中，您的容器必须具有ID

ifrm\u容器

<iframe resize-iframe id="iframe" src="...">

.directive('resize-iframe', function() {
    return {
       restrict: 'A',
       link: function ( scope, elm, attrs ) {

        var container = elm.contentWindow.document.getElementById('ifrm_container'); // Iframe container. Usualy a div. 

        function autoResize(){
             ifrmNewHeight = container.offsetHeight; // New height of the document.

             if(ifrmNewHeight !== ifrmOldHeight) {
                ifrmOldHeight = ifrmNewHeight + 30; // +30 for no scrollbar.
                ifrm.style.height= (ifrmNewHeight + 30) + "px"; // Set iframe style.
             }

            setTimeout(autoResize, 250);
        }
      // First call of autoResize().
      autoResize();
  };
});

.directive（'resize-iframe'，function（）{
返回{
限制：“A”，
链接：功能（范围、elm、属性）{
var container=elm.contentWindow.document.getElementById（'ifrm_container'）；//Iframe container.Usualy是一个div。
函数自动调整大小（）{
ifrmNewHeight=container.offsetHeight；//文档的新高度。
if（ifrmNewHeight！==ifrmOldHeight）{
ifrmOldHeight=ifrmNewHeight+30；//+30表示无滚动条。
ifrm.style.height=（ifrmNewHeight+30）+“px”；//设置iframe样式。
}
设置超时（自动调整大小，250）；
}
//第一次调用autoResize（）。
自动调整大小（）；
};
});

我已经在所有浏览器甚至IE7上测试了这个解决方案，它工作得很好，但在指令中没有（更改了一些元素）

---

此指令未经测试

尝试一下，一个用于自动调整iFrame大小的js模块。

只指定“溢出：隐藏”不是更容易、更兼容吗"在嵌入的文档中？很好。我不希望溢出被隐藏。尝试使用滚动：不，你可以按照这里的属性设置间隔是个好主意。但是，这会导致屏幕闪烁。有什么东西不会导致屏幕闪烁吗？这只会在加载时调整大小。我的帧的内容会一直更改，w没有加载。将Max的答案封装到指令中是一个不错的主意。但是，它仍然有屏幕闪烁的相同缺点。