1

我正在制作自己的基本文本编辑器。我有一个 iframe，用户可以在其中输入他们的代码。

在 iframe 下方，有一个隐藏的 div。这个 div 通常会捕获 IFrame 中写入的内容，换句话说，用户将在上面的 Iframe 中输入的每个 HTML 和 CSS 代码，都会在下面的 div 中执行“OnKeyUp”操作。

现在下面的 div 是隐藏的，只有在用户单击按钮时才会预览。结果，这将在 JQuery 对话框中弹出。简而言之，将通过JQuery UI的对话框弹出div，向用户显示他/她正在编码的结果。

我知道我们可以在 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 或将所有标题 1 设为蓝色，并且如果用户在文本区域中键入标题 1 标签，我的 CSS 代码也将适用于用户，所以我不不想要这个。

4

0 回答 0