在 jQuery UI 对话框中以编程方式创建的 iframe 的大小

Posted 2023-05-09

【中文标题】在 jQuery UI 对话框中以编程方式创建的 iframe 的大小

【英文标题】：Size programatically created iframe within jQuery UI dialog

【发布时间】：2017-02-11 14:32:05

【问题描述】：

我有一个似乎无法解决的问题，我想要一些建议。

所以，我在 JS 中有一个 URL。

目的是打开一个 jQueryUI 对话框，其中包含一个包含该 URL 的 iFrame。

对话框应尽可能小以适应 iFrame 内容而无需滚动。

我在另一个问题 (Adjust width height of iframe to fit with content in it) 中读到了一些内容，建议：

iframe = iframe[0];
iframe.width  = iframe.contentWindow.document.body.scrollWidth;
iframe.height = iframe.contentWindow.document.body.scrollHeight;

但我无法让它工作。

确实，在创建对话框之前 iFrame 内容不存在，到那时为时已晚，更改 iframe 大小不会改变对话框大小。

这是我在这个问题上的进展。

https://jsfiddle.net/587mj6oy/

非常感谢您的帮助，

马克西姆

【问题讨论】：

都在同一个域中

【参考方案1】：

您可以使用 css 设置 iframe 的高度和宽度。图片是动态的还是静态的？

iframe height:300px;width:300px;

【讨论】：

那太容易了！基本上就是一张有一定行数的表格，在开框之前我无法知道行数。

【参考方案2】：

试试这个：

var img = new Image();
img.src = input_link;

img.onload = function() 
   iframe.width(this.width);
   iframe.height(this.height);

【讨论】：

首先，是否需要加载图片并获取之后的尺寸。