iframe高度自适应
在前端开发过程中用到了iframe控件。将其他页面嵌套如父页面中。当子页面高度不固定时,iframe的高度无法实现自适应。
解决方案:
父页面:
<iframe id="parentIframe"
src="hello.html"
frameborder="0" width="100%" height="100%"></iframe>
在子页面定义setParentIframeHeight()方法并调用。
function setParentIframeHeight() {
try {
var parentIframe = parent.document.getElementById("parentIframe");
if (window.attachEvent) {
window.attachEvent("onload", function () {
parentIframe.height = document.documentElement.scrollHeight + 40 + "px";
});
return;
} else {
window.onload = function () {
parentIframe.height = document.body.scrollHeight + 40 + "px";
};
return;
}
} catch (e) {
throw new Error('setParentIframeHeight Error');
}
}
父页面调用子页面方法:
$("#parentIframe")[0].contentWindow.getTest();
版权声明:本文为博客园博主「Spear_J」的原创文章,编写不易,转载请附上原文出处链接及本声明。
https://www.cnblogs.com/lmh15054109/p/15936302.html