0

我有此代码但无法正常工作... iFrame 不会根据其内容调整大小...

我做错了什么？我已经尝试了很多代码，任何人都在为我工作......

有什么建议么？

page.html

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>TEST</title>
</head>
<body>
    <iframe id="klaus" src="iframe.html" width="960" height="100%"></iframe>
</body>
</html>

iframe.html

<!DOCTYPE html>
<html>
<head>
<title>pagina</title>
<script language="Javascript" type="text/javascript">
  parent.document.getElementById("klaus").height = document.getElementById("size").scrollHeight + 40;
</script>
</head>
<body>
<div id="size">
<p>Conteudo</p> <p>Conteudo</p> <p>Conteudo</p> <p>Conteudo</p> <p>Conteudo</p>
<p>Conteudo</p> <p>Conteudo</p> <p>Conteudo</p> <p>Conteudo</p> <p>Conteudo</p>
<p>Conteudo</p> <p>Conteudo</p> <p>Conteudo</p> <p>Conteudo</p> <p>Conteudo</p>
<p>Conteudo</p> <p>Conteudo</p> <p>Conteudo</p> <p>Conteudo</p> <p>Conteudo</p>
<p>Conteudo</p> <p>Conteudo</p> <p>Conteudo</p> <p>Conteudo</p> <p>Conteudo</p>
<p>Conteudo</p> <p>Conteudo</p> <p>Conteudo</p> <p>Conteudo</p> <p>Conteudo</p>
<p>Conteudo</p> <p>Conteudo</p> <p>Conteudo</p> <p>Conteudo</p> <p>Conteudo</p>
<p>Conteudo</p> <p>Conteudo</p> <p>Conteudo</p> <p>Conteudo</p> <p>Conteudo</p>
<p>Conteudo</p> <p>Conteudo</p> <p>Conteudo</p> <p>Conteudo</p> <p>Conteudo</p>
<p>Conteudo</p> <p>Conteudo</p> <p>Conteudo</p> <p>Conteudo</p> <p>Conteudo</p>
</div>
</body>

</html>
4

3 回答 3

1

我认为这会对您有所帮助，将此块放在 iframe.html 页面的末尾并删除您的块。

<script language="Javascript" type="text/javascript">

  var _iframe = parent.document.getElementById("klaus"),
      _height = _iframe.contentDocument.getElementById("size").scrollHeight || _iframe.contentWindow.document.getElementById("size").scrollHeight;
      _iframe.height = _height + 40;
</script>
于 2013-04-09T13:18:32.873 回答
0

您设置错误的高度属性。它缺少高度之前的样式。此外，没有调用 javascript 代码，我将它添加到在页面的 onload 中调用的函数中。检查代码：

<title>pagina</title>
<script language="Javascript" type="text/javascript">
function resizeIframe(){  
parent.document.getElementById("klaus").style.height = document.getElementById("size").scrollHeight + 40;
}
</script>
</head>
<body onload="resizeIframe()">
于 2013-04-09T13:01:57.570 回答
0

iframe 永远不会根据其内容调整大小。您需要使用 javascript 来实现这一点。您的百​​分比样式值将始终引用 iframe 的最近定位父级，就像大多数其他元素一样。

这个问题显示了如何为此使用脚本：

调整 iframe 的宽度高度以适应其中的内容

于 2013-04-09T13:10:08.450 回答