我正在制作自己的基本文本编辑器。我有一个iframe，用户可以在其中输入代码。
在Iframe下方，有一个隐藏的div。这个div通常会捕获IFrame中写的内容，换句话说，用户将在上面的iframe中键入的每个HTML和CSS代码，它将在下面的div中执行“OnKeyUp”操作。
现在下面的div，因为它是隐藏的，只有当用户点击按钮时才会预览。结果，这将弹出一个JQuery对话框。简而言之，div将通过JQuery UI的对话框弹出，以向用户显示他/她正在编码的结果。
我知道我们可以在textarea中做到这一点，这只是一个“价值”的问题，但我没有得到它与Iframe。我做了这个：
function pcode () {
var frame = document.getElementById('code').value;
var div = document.getElementById('preview');
divout.innerHTML = frameout;
}
上面的代码，只是为了获取在iframe中写入的值，然后在OnKeyUp下面的div中预览它。现在，用户单击按钮后，在JQuery UI对话框中预览div的代码：
function preview() {
$('#preview').dialog({modal:true, height:600, width:1280, title:"Preview", show:"slow", hide:"fast"});
}
$('#previewbutton').click(function() {
preview();
});
问题是什么都没有用。如果你还没有理解这个问题，你可以问我一些问题，我自己也是这样强调的。如果它是textarea，一切都会好的，就像我之前用textarea做的那样，很好。
在同一思路中，我建议在编写文本编辑器时使用IFrame，因为如果我使用textarea执行此操作，则用户的代码可能与我自己的页面CSS代码冲突。我想知道是否有可能单独使用textarea而不是iframe，以防没有解决方案，但用户CSS和HTML代码不得与我自己的CSS代码冲突。例如，如果我已经声明了一个类或ID或者将所有Heading 1设为蓝色，并且如果用户在textarea中键入Heading 1标记，那么我的CSS代码也将适用于用户，所以我不知道我想要这个。