html中iframe怎么自动适应高度
iframe页面（父页面）：
<a href="a1.html" target="a1">页面1</a>
<a href="a2.html" target="a2">页面2</a>
<iframe id="a1" name="a1" style="width:200px;">
现在要求:点击a标签时iframe加载对应页面（已经实现），然后iframe中的页面不出现纵向滚动条并内容显示完整,a1.html中body的高度为500，a2.html中body的高度为1000
我这有一段代码，挺好用的 你可以试一下
function iFrameHeight() {
var ifm = document.getElementById("ifbox");
var subWeb = document.frames ? document.frames["ifbox"].document : ifm.contentDocument;
if (ifm != null && subWeb != null) {
ifm.height = subWeb.body.scrollHeight;
}
}
<iframe onload="javascript:iFrameHeight()" name="ifbox" src="" scrolling="no"
frameborder="0" id="ifbox"></iframe>追问
不行，加载a1.html是成功了（高500），然后加载a2.html也成功了（高1000），然后在去加载a1.html，页面底部就会出现500的空白区域
追答你其它块是不是也设置了高度，我现在用的就是这个，就没有你这个问题，你的是html页面吗，我的是aspx页面，不知道是不是有差别
温馨提示：内容为网友见解，仅供参考
第1个回答 推荐于2017-09-22
<script type="text/javascript">
$(function () {
document.getElementById("ifm").src ="";//Url地址
$("#ifm").load(function () {
var h = document.body.clientHeight;
var w = document.body.clientWidth;
document.getElementById("ifm").height = h + "px";
document.getElementById("ifm").width = w + "px";
});
})
</script>
<body style="overflow-y:hidden;overflow-x:hidden">
<div id="pageone" style="">
<iframe name="ifm" id="ifm" scrolling="yes" style="background-color: transparent;" marginwidth="0" marginheight="0" frameborder="0">
</iframe>
</div>
</body>
$(function () {
document.getElementById("ifm").src ="";//Url地址
$("#ifm").load(function () {
var h = document.body.clientHeight;
var w = document.body.clientWidth;
document.getElementById("ifm").height = h + "px";
document.getElementById("ifm").width = w + "px";
});
})
</script>
<body style="overflow-y:hidden;overflow-x:hidden">
<div id="pageone" style="">
<iframe name="ifm" id="ifm" scrolling="yes" style="background-color: transparent;" marginwidth="0" marginheight="0" frameborder="0">
</iframe>
</div>
</body>
第2个回答 2014-09-17
这个恐怕不行吧
相似回答
