[JS] IFrame动态自动增高

 最近要做一只主程式里面包多个子页签，每个页签都有关联的动态程式，因此需要在子程式画面变动时，自动调整IFrame高度，避免Scrollbar的出现。

 

当IFrame是静态内容，可直接在IFrame的onload自动增高，如果IFrame内容是动态程式，就需要在程式中执行自动增高JS，小弟的作法是IFrame网址多传入IFrame的ID，然后动态程式接ID参数再执行自动增高JS，如此就可以将动态程式完美地包在主程式中。

我使用Update Panel，所以需要接值后在Page_PreRender注册SetFrameHeight("test");语法，非AJAX的作法可以放在onLoad事件就可以了。

 

此方法经过测试可相容于IE、FF、CHROME浏览器。

 

<iframe id="test" style="width:100%;" scrolling="no" frameborder="0"
src='./test.aspx?iframeid=test'></iframe>

1    //自动调整FRAME高度
2    function SetFrameHeight(iframeID)
3    {
4        parent.document.getElementById(iframeID).height = (document.body.scrollHeight+10)+'px';
5    }