jQuery 内容（）更改 iframe 的 html 在 Firefox 中消失答案

【问题标题】：Jquery contents() change html for iframe disappear in firefoxjQuery 内容（）更改 iframe 的 html 在 Firefox 中消失
【发布时间】：2015-02-16 22:45:26
【问题描述】：

// Use ckeditor created a iframe dom.
var iframe_node = new CKEDITOR.dom.element('iframe');
var iframe_styles = {
  'font-size':'inhert',
  'z-index':'10030',
  'position':'absolute',
  'left':'250px',
  'top':'50px',
  'width':'505px',
  'height':'441px'
};
iframe_node.setStyles(iframe_styles);

// Append iframe to cke_dialog
jQuery(iframe_node.$).appendTo('.cke_dialog');

var seciframecon = jQuery('.cke_dialog').find("iframe").contents();
iframe_node = jQuery(iframe_node.$)[0];

console.log(seciframecon.find('html').html());
// I get <head></head><body></body>

seciframecon.find('html').html(htmloutput);

console.log(seciframecon.find('html').html());

我得到我的字符串像

<div class="ctools-modal-content> <div class="modal-header">   <span class="modal-title" id="modal-title" style="font-size:20px;">Format</span>   <input value="format_facet" name="selectedfacet" type="hidden">   <a href="#" class="close"><img title="Close window" alt="Close window" src="xxxx" typeof="foaf:Image"> </a> </div> <div class="modal-content" id="modal-content" style="width: 475px; height: 355px;">  <table>    <thead>      <tr><th style="text-align:center;width:70px;">Include</th>        <th style="text-align:center;width:70px;">Exclude</th>        <th>Format</th>      </tr>     </thead>     <tbody>            <tr class="odd">       <td style="text-align:center;width:70px;"><div>balabalabala ....

这应该可以更改 iframe 内容，但它在 Firefox 中不起作用！

来自 firebug 的 html 显示如下。

<iframe style="z-index: 10030; position: absolute; left: 250px; top: 50px; width: 505px; height: 441px;">
 <html>
   <head>
   </head>
   <body>
   </body>
 </html>

html 已附加，然后在 firefox 中很快消失

为什么console.log(seciframecon.find('html').html());在seciframecon.find('html').html(htmloutput);之后可以得到字符串，但 iframe 内容在 firefox 浏览中还是空白？

它在 Chrome 中运行良好。

有什么提示吗？

【问题讨论】：

标签： jquery firefox iframe cross-browser ckeditor

【解决方案1】：

最后，我修复了它。原因是

我尝试修改 iframe 时未强制加载它。

通过将 load 绑定到这个 iframe dom，它可以在 firefox 中运行。

jQuery(iframe_node.$).load('/topic-page/ajax/ckedialogpopup/' + selecttermfacet + '/' + filter, function(){
  CKEDITOR.scriptLoader.load(
  [
    "/sites/all/themes/pharosui_omega/ckeditor/jsrender.min.js"
  ],
  function() {
    ...

当我处理这个问题时，我遇到了另一个问题 jQuery .load() 在 Chrome 中不起作用 我通过将数据更新到 Web 服务器而不是从本地获取来修复它，导致 jquery 加载功能不适用于本地（html/text）数据。

希望这对其他人有所帮助。

【讨论】：