停止 IE/Edge 窗口大小调整为 iframe 尺寸
Posted
技术标签:
【中文标题】停止 IE/Edge 窗口大小调整为 iframe 尺寸【英文标题】：Stop IE/Edge window resize to iframe dimensions 【发布时间】：2018-05-29 03:42:50 【问题描述】：问题：
通过 AJAX 调用将内容加载到 iframe 时，IE/Edge 会将浏览器窗口的大小调整为 iframe 的宽度和高度，而不是保持原始尺寸。 iframe 包含<html><body> 标签等。
<iframe id="main" name="main"
frameborder="0"
style="height: 600px !important; width: 100% !important;"
scrolling="no" src="/en/courseid2900">
#document
<!DOCTYPE html>
<html></html>
</iframe>（在 IE/Edge 中的 AJAX 调用之前）
<iframe id="main" name="main"
frameborder="0"
style="height: 696.796875px"
scrolling="no" src="/en/courseid2900">
#document
<!DOCTYPE html>
<html lang="en-US" class=" -webkit-">...</html>
</iframe>（在 IE/Edge 中的 AJAX 调用之后）
那么，有没有办法如何阻止将窗口大小调整到 iframe 尺寸？可以通过 jQuery 或 HTML hack 来完成吗？谢谢。
【问题讨论】：
我不知道 IE 会这样做——如果我理解正确的话——您是否尝试过直接设置 iframe 高度？<iframe height="600px"></iframe>
@cidicles 在问题中的 sn-p 之前、之后添加了一个。但是，是的，我假设 IE/Edge 无法识别多个 <html> 标签或类似标签，因此它认为“我必须使用我找到的最后一个 <html> 标签的尺寸。”
你有 jsbin 或 fiddle 或其他可以显示这种情况的东西吗？因为正确设置 iframe 的内容不应该对拥有的文档有任何影响（您不能只是在 iframe 元素标记中“粘贴页面代码”，您可以将其 src 属性指定为 HTLM，或者您需要在 JS 端做一些手动的 dom 操作）
【参考方案1】：
iframe 元素 may not contain any content 所以您在帖子中显示的代码是 100% 不正确的 HTML。如果您想要 iframe 中的内容，您可以使用 src 属性将其指向一个真实的 URL，或者您在 javascript 中手动构建一个 iframe DOM 节点，然后将其插入到您的文档中。
您作为标记而不是通过 JS 进行 DOM 操作放入 iframe 元素中的任何内容根据 iframe 元素的定义被视为 父文档 内容。按照您的帖子的建议，您创建了一个包含 两个 <html> 部分的文档，浏览器会做非常不正确的事情也就不足为奇了：您做了非常不正确的事情 =)
【讨论】：
谢谢。我正在使用生成此代码的 LMS 系统（JoomlaLMS，Storyline 360），所以我必须让他们知道它的结构不正确。在此期间，我会尝试快速解决问题。以上是关于停止 IE/Edge 窗口大小调整为 iframe 尺寸的主要内容，如果未能解决你的问题，请参考以下文章
.append 的 CSS 不会影响 IE/Edge 中的 iframe
在 Unity 中，如何检测窗口是不是正在调整大小以及窗口是不是已停止调整大小
X-UA-Compatible in parent is IE=8, page in IFRAME IE=edge,chrome=1