检测Iframe内容何时加载（跨浏览器）
我试图检测一个iframe和它的内容何时加载，但没有太多的运气。 我的应用程序需要在父窗口的文本字段中input一些内容，并更新iframe以提供“实时预览”
我开始使用下面的代码（YUI）来检测何时发生iframe加载事件。
$E.on('preview-pane', 'load', function(){ previewBody = $('preview-pane').contentWindow.document.getElementsByTagName('body')[0]; } 'preview-pane'是我的iframe的ID，我使用YUI来附加事件处理程序。 但是，试图访问身体在我的callback（在iframe加载）失败，我想因为iframe加载事件处理程序准备就绪之前。 这个代码工作，如果我通过使生成睡眠的PHP脚本延缓iframe加载。
基本上，我问什么是正确的方法跨浏览器检测何时加载iframe，其文档已准备好？
检测iframe何时加载并且文档已准备好？
如果您可以通过框架内的脚本获取iframe来告诉您自己，那将是理想的select。 例如，它可以直接调用父函数来告诉它已经准备好了。 交叉帧代码执行总是需要小心，因为事情可能以您不希望的顺序发生。 另一种方法是设置“var isready = true;” 在其自己的范围内，并有父脚本嗅探'contentWindow.isready'（并添加onload处理程序，如果没有）。
如果由于某种原因使iframe文档不能合作，那么就会遇到传统的加载竞争问题，即即使元素彼此相邻：
<img id="x" ... /> <script type="text/javascript"> document.getElementById('x').onload= function() { ... }; </script>
不能保证该项目在脚本执行的时候不会被加载。
负荷种族的方式是：
-
在IE上，你可以使用'readyState'属性来查看是否已经加载了一些东西;
-
如果仅在启用了JavaScript的情况下才能使用该项目，则可以在设置源并追加到页面之前dynamic创build它，设置“onload”事件函数。 在这种情况下，它不能在callback设置之前加载;
-
把它包含在标记中的老派方式：
<img onload="callback(this)" ... />
在HTML中内联'onsomething'处理程序几乎总是错误的东西，要避免，但在这种情况下，有时这是最不好的select。
看到这个博客文章。 它使用jQuery，但即使不使用它也应该可以帮助你。
基本上你把这个添加到你的document.ready()
$('iframe').load(function() { RunAfterIFrameLoaded(); });
对于那些使用React的人来说，检测同样的iframe加载事件就像在iframe元素上设置onLoad事件监听器一样简单。
<iframe src={'path-to-iframe-source'} onLoad={this.loadListener} frameBorder={0} />
对于使用Ember的人来说，这应该可以按预期工作：
<iframe onLoad={{action 'actionName'}} frameborder='0' src={{iframeSrc}} />
