jQuery 内容()更改 iframe 的 html 在 Firefox 中消失
Posted
技术标签:
【中文标题】jQuery 内容()更改 iframe 的 html 在 Firefox 中消失【英文标题】:Jquery contents() change html for iframe disappear in 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" 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 中运行良好。
有什么提示吗?
【问题讨论】:
【参考方案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)数据。
希望这对其他人有所帮助。
【讨论】:
以上是关于jQuery 内容()更改 iframe 的 html 在 Firefox 中消失的主要内容,如果未能解决你的问题,请参考以下文章
jQuery 内容()更改 iframe 的 html 在 Firefox 中消失
根据内部更改的内容动态调整 jQuery Fancybox 的 iframe 高度
如何使用 jquery 从 IFrame 本身更改 IFrame 样式?