Javascript 为什么 iframe.contentWindow == null？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/12199797/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Why is iframe.contentWindow == null?
提问by Timo
I use the following code to dynamically create an iframe.
我使用以下代码动态创建 iframe。
var iframe_jquery = $("<iframe>")
.addClass("foo")
.appendTo(container); // container is a jQuery object containing a <div> which already exists
Then, I want to access its contentWindow, but it's null:
然后，我想访问它的 contentWindow，但它为空：
var iframe = iframe_jquery.get(0);
if (iframe){ // iFrame exists
console.log(iframe.contentWindow); // Prints "null"
var doc = iframe.contentWindow.document; // NullpointerException
}
So I thought: "Maybe the iframe isn't ready yet?" So I tried:
所以我想：“也许 iframe 还没有准备好？” 所以我试过：
iframe_jquery.ready(function(){
var iframe = iframe_jquery.get(0);
console.log(iframe.contentWindow); // Prints "null"
var doc = iframe.contentWindow.document; // NullpointerException
});
Same result.
结果一样。
What's wrong?
怎么了？
采纳答案by Losbear
I had this problem last week while playing with iFrames (building an rtf editor), and yeah it's not ready yet.
上周我在玩 iFrames（构建 rtf 编辑器）时遇到了这个问题，是的，它还没有准备好。
I thought if I put it in a .ready()it would work, but .ready()is when the DOM is ready, not when the iFrame has loaded its contents, so I ended up wrapping my code with jQuery .load().
我想如果我把它放在 a.ready()它会工作，但是.ready()当 DOM 准备好时，而不是当 iFrame 加载它的内容时，所以我最终用 jQuery 包装了我的代码.load()。
So try this:
所以试试这个：
$(function () {
$("#myiframe").load(function () {
frames["myframe"].document.body.innerHTML = htmlValue;
});
});
Hope this helps
希望这可以帮助
回答by Pointy
The problem is that your <iframe>won't be "real" until it's really added to the actual DOM for the page. Here is a fiddle to demonstrate..
问题是，在<iframe>它真正添加到页面的实际 DOM 之前，你不会是“真实的”。 这里有一个小提琴来演示。.
回答by Gabe
Depending on the browser, accessing the documentor an <iframe>may vary.
根据浏览器的不同，访问document或<iframe>可能会有所不同。
Here is an example of how to handle it:
以下是如何处理它的示例：
if (iframe.contentDocument) // FF Chrome
doc = iframe.contentDocument;
else if ( iframe.contentWindow ) // IE
doc = iframe.contentWindow.document;
回答by Vladivarius
You can also make a function that will be executed when the iframe has finished loading by setting it's onload attribute.
您还可以通过设置 iframe 的 onload 属性来创建一个将在 iframe 加载完成后执行的函数。
回答by Pebbl
Bookmarklet version
小书签版本
Just out of curiosity I thought I'd put this together. Remembering that iframes and load events don't play well together on different browsers (mainly older, falling apart, should-be-dead browsers)... plus not being entirely sure how jQuery gets around this problem... my brain decided that this would be better supported (whether it is or not is neither here nor there):
只是出于好奇，我想我会把它放在一起。记住 iframe 和加载事件在不同的浏览器上不能很好地协同工作（主要是旧的、崩溃的、应该死的浏览器）......加上不完全确定 jQuery 如何解决这个问题......我的大脑决定这将得到更好的支持（无论是否存在，都不在这里或那里）：
$(function(){
/// bind a listener for the bespoke iframeload event
$(window).bind('iframeload', function(){
/// access the contents of the iframe using jQuery notation
iframe.show().contents().find('body').html('hello');
});
/// create your iframe
var iframe = $('<iframe />')
/// by forcing our iframe to evaluate javascript in the path, we know when it's ready
.attr('src', 'javascript:(function(){try{p=window.parent;p.jQuery(p).trigger(\'iframeload\');}catch(ee){};})();')
/// insert the iframe into the live DOM
.appendTo('body');
});
The reason for taking this approach is that it is normally far better to trigger your load event from inside the iframe itself. But this means having a proper document loaded in to the iframe, so for dynamic iframes this is a little tedious. This is kind of a mixture between having a document loaded, and not.
采用这种方法的原因是通常从 iframe 本身内部触发加载事件要好得多。但这意味着将适当的文档加载到 iframe 中，因此对于动态 iframe，这有点乏味。这是加载文档和不加载文档之间的混合。
The above works on everything I have tested so far - and yes you are correct - it is a little ridiculous, non-future-proof and propably other things that have negative connotations ;)
以上适用于我迄今为止测试过的所有内容 - 是的，你是对的 - 这有点荒谬，非面向未来，并且可能还有其他具有负面含义的东西；）
One positive thing I'll say about this post is that introduces the use of .contents()to access the document of the iframe, which is at least a little bit useful...
关于这篇文章，我要说的一件积极的事情是介绍了.contents()访问 iframe 文档的用法，这至少有点有用......
