Jquery contents()更改了forrame中的iframe在firefox中消失了

时间:2014-12-18 07:53:20

标签: jquery firefox iframe cross-browser ckeditor

// 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中不起作用!

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);之后可以获取字符串, 但是在firefox浏览中iframe内容仍然是空白的?

在Chrome中效果很好。

任何提示?

1 个答案:

答案 0 :(得分:0)

最后,我修好了。 原因是

当我尝试修改iframe时,

iframe未加载。

通过将加载绑定到此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 /文本)数据。

希望这有助于其他人。