我遇到了iframe高度的串起问题。
在它的父页面中，我们将其设置为 height = 900px，如下所示：
<html lang="en-us">
<head>
<?php include_once "./includes/header.php"; ?>
</head>
<body>
<?php include_once "./includes/top.php" ?>
<?php include_once "./includes/left_nav.php" ?>
<section id="content">
<iframe width="100%" height="900" id="myFrame" src="./modules/ophthalmology/patients.php" scrolling="no" frameborder="0">
</iframe>
</section>
<?php include_once "./includes/footer.php" ?>
</body>
</html>
但它不能显示其中的所有内容。我用萤火虫检查了元素，然后发现：
<iframe id="myFrame" width="100%" scrolling="no" height="208" frameborder="0" src="./modules/ophthalmology/patients.php">
高度更改为 208。
但在另一个模块中，它的源代码：
<html lang="en-us">
<head>
<?php include_once "./includes/header.php"; ?>
</head>
<body>
<?php include_once "./includes/top.php" ?>
<?php include_once "./includes/left_nav.php" ?>
<section id="content">
<iframe width="100%" height="900" id="myFrame" src="./modules/csvfileupload/index.html" scrolling="no" frameborder="0">
</iframe>
</section>
<?php include_once "./includes/footer.php" ?>
</body>
</html>
它更改为：
<iframe id="myFrame" width="100%" scrolling="no" height="930" frameborder="0" src="./modules/csvfileupload/index.html">
这两者的唯一区别是src文件不同，第一个是患者.php，第二个是索引.html，其他都是一样的。
我已经检查了内容的元素，它是css：
#content {
border: 1px solid;
border-bottom-left-radius: 4px;
border-bottom-right-radius: 4px;
margin: 0;
min-height: 600px;
overflow: visible;
padding: 15px 5px 15px 230px;
}
我还发现标头中有一个 js 函数.php：
function sizeFrame() {
var F = document.getElementById("myFrame");
if(F.contentDocument) {
F.height = F.contentDocument.documentElement.scrollHeight+30; //FF 3.0.11, Opera 9.63, and Chrome
} else {
F.height = F.contentWindow.document.body.scrollHeight+30; //IE6, IE7 and Chrome
}
}
window.onload=sizeFrame;
怎么了？
对于嵌入了 iframe 的 HTML 文档，您的 JavaScript 代码只是在 iframe 元素的 height 属性的值上加 30。这解释了值 930。 与此处的目标相反，您获得的scrollHeight值只是内联框架元素的高度，而不是嵌入文档的固有高度要求。
对于 HTML 以外的嵌入文档，可能会发生奇怪的事情。例如，如果它是一个纯文本文件，则scrollHeight值可能反映从其中的行数派生的固有高度要求。不知道服务器在请求./modules/ophthalmology/patients.php时返回什么，我只能猜测它是非 HTML 的东西。