jQuery 添加带有内容的 iFrame

Question

我有这样的问题。 我需要在 fancybox 中打开 iframe （我需要 iframe 因为我需要浏览打开的文档中的链接并停留在 fancybox 中）， 但我想将内容从变量放入 iframe，而不是通过 src 属性（我已经通过 AJAX 获取内容（我需要在将内容放入 iframe 之前对内容进行一些检查，所以没有办法代替 AJAX 来做到这一点）查询），所以我不需要再查询）。

Fancybox 不允许将 'content' 属性与 'type':'iframe' 一起使用。所以我决定动态创建 iframe，将我的内容插入其中，并通过 fancybox 将 iframe 显示为常规块。

这就像

jQuery('<iframe id="someId"/>').appendTo('body').contents().find('body').append(content);

And than

jQuery('<iframe id="someId"/>').fancybox();

但第一部分不起作用。我可以看到添加到页面的 iframe，但没有任何内容（我在可变内容中有完整的 HTML 页面，但当我尝试仅附加一些文本时，它不起作用）。

我做错了什么？

也许还有另一种方法可以满足我的需要？

Answer 1

像这样调用jquery的ready方法后你的问题就会解决

<script type="text/javascript">
$(function(){
$('<iframe id="someId"/>').appendTo('body');
$('#someId').contents().find('body').append('<b>hello sajjad</b>');
});
</script>

<iframe id="someId"></iframe>

Answer 2

如果你将该行分成两部分，会发生什么：

jQuery('<iframe id="someId"/>').appendTo('body');
jQuery('#someId').contents().find('body').append(content);

然后在创建新的 iframe 之前将选择器更改为正确的，而不是将其插入到 DOM 中并在其上调用 fancybox，但这应该可以工作：

jQuery('#someId').fancybox();

Answer 3

这个问题已经过去了，但这里有另一个解决方案：

var ifrm = document.createElement("iframe");
document.body.appendChild(ifrm);
ifrm.id = "someId"; // optional id
ifrm.onload = function() {
    // optional onload behaviour
}
setTimeout(function() {
    $(ifrm).contents().find("body").html(content);
}, 1);