请考虑以下代码:
<html>
<head>
<title></title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/jquery-ui.js"></script>
</head>
<body>
<div id="dlgDiv" style="width:202px; height:72px; border: solid 1px grey"></div>
<iframe id="iView" style="width: 200px; height:70px; border: dotted 1px red" frameborder="0"></iframe>
<script type="text/javascript">
jQuery(document).ready(function() {
var doc = document.getElementById("iView").contentWindow.document;
doc.designMode = "On"
doc.open()
doc.write("<html><head></head><body class='some-class'>Some test text</body></html>");
doc.close();
jQuery("#iView").appendTo("#dlgDiv")
})
</script>
</body>
</html>
在 IE 中，它工作正常，并在框架中保留测试(“一些测试文本”)，并将其保持在设计模式下。 在 FF/Chrome/Opera 中，它会清除 iframe 的所有内容 - 如果您使用 FireBug 检查它的 DOM，您可以看到 iframe.body 丢失了它的“some-class”类以及所有文本，并且它不处于设计模式。 有什么想法如何克服这个问题？最初的问题是所有富文本编辑器都无法在这些浏览器中的 jQuery.dialog 中工作，我将问题追溯到上述事实......
这对我来说是一个真正的表演障碍，他将非常感谢任何帮助!
谢谢你， 安德烈
最佳答案
需要刷新移动(appendTo)并且找不到 iframe:
<html>
<head>
<title></title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/jquery-ui.js"></script>
</head>
<body>
<div id="dlgDiv" style="width:202px;height:72px;border:solid 1px grey"></div>
<iframe id="iView" style="width:200px;height:70px;border:dotted 1px red" frameborder="0"></iframe>
<script type="text/javascript">
jQuery(document).ready(function() {
$("#iView").appendTo("#dlgDiv");
setTimeout(function(){
var iBody = $("#dlgDiv").find('#iView').contents().find("body"); // <-----
iBody.append("<div>my bad html</div>"); // old container
iBody.empty(); // empty body in iframe
iBody.append("Some test text"); //add container
iBody.append("<div>or something right</div>"); //add container
iBody.attr("class", "some-class"); //add class to body
}, 100);
})
</script>
</body>
</html>
版本:因为它是可以理解的
关于javascript - 使用 jQuery.append 插入 iframe 的内容后消失，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/1765490/