停止 IE/Edge 窗口大小调整为 iframe 尺寸答案

【问题标题】：Stop IE/Edge window resize to iframe dimensions停止 IE/Edge 窗口大小调整为 iframe 尺寸
【发布时间】：2018-05-29 03:42:50
【问题描述】：

问题： 通过 AJAX 调用将内容加载到 iframe 时，IE/Edge 会将浏览器窗口的大小调整为 iframe 的宽度和高度，而不是保持原始尺寸。 iframe 包含<html><body> 标签等。

<iframe id="main" name="main" 
frameborder="0" width="100%" height="600" 
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" width="100%" height=""
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 操作）

标签： javascript jquery html ajax iframe

【解决方案1】：

iframe 元素 may not contain any content 所以您在帖子中显示的代码是 100% 不正确的 HTML。如果您想要 iframe 中的内容，您可以使用 src 属性将其指向一个真实的 URL，或者您在 JavaScript 中手动构建一个 iframe DOM 节点，然后将其插入到您的文档中。

您作为标记而不是通过 JS 进行 DOM 操作放入 iframe 元素中的任何内容根据 iframe 元素的定义被视为 父文档 内容。按照您的帖子的建议，您创建了一个包含两个 <html> 部分的文档，浏览器会做非常不正确的事情也就不足为奇了：您做了非常不正确的事情 =)

【讨论】：

谢谢。我正在使用生成此代码的 LMS 系统（JoomlaLMS，Storyline 360），所以我必须让他们知道它的结构不正确。在此期间，我会尝试快速解决问题。