突出显示/格式textareas

我正在寻找在保留空白的网页内实现一个实时差异。突出显示/格式textareas

我在过去在IE6中使用TinyMCE和JQuery的组合（对于该项目是必需的），但它没有保留空白。（它不应该，但我没有添加任何东西来实现它，它只是）。 TinyMCE并不理想，因为我正在处理纯文本，而TinyMCE是一种支持丰富文本的所见即所得风格编辑器。它的大部分功能都没有被使用，并且很难禁用。

我浏览了大部分在http://en.wikipedia.org/wiki/Comparison_of_JavaScript-based_source_code_editors列出的项目。 EditArea看起来很有希望，但似乎无法确定哪些元素实际上用于显示文本。

$（ '＃frame_modified'）。内容（）。找到（ '＃编辑器'）。文本（）

显示大量的在线信息（123456789101112等）以及光标所在的行，但不是其余的。我还没有想出如何应用/修改与之相关的样式。

比方说用户类型富，我想，使其显示为<跨度类=“酒吧” > FOO在飞行</SPAN >把它包起来。要获得这种功能，最简单的解决方案是什么？

IE8是此项目的目标浏览器。

来源

2010-08-18 Rob Paisley

你可以对onKeyDown事件做一些操作（在你自己的插件中）。如果您的光标已经在新的范围内，则添加刚输入的字符，然后用输入的字符创建一个新的范围。这样的事情：

ed.onKeyDown.add(function(ed,evt){ 
    char = getChar(evt.keyCode); // your function to get the character to be inserted depending on evt.keyCode 

    // if span already exists 
    node = ed.selection.getNode(); 
    if (node.nodeName.toLowerCase() == 'span' && node.className == 'myclass'){ 
    node.innerHTML += char; 
    } 
    // new span 
    else { 
    doc = ed.getDoc(); 
    new_element = doc.createElement('span'); 
    new_element.className = "myclass"; 
    new_element.innerHTML = char; 
    tinymce.activeEditor.mceInsertContent(new_element); 
    } 
})

来源

2010-08-19 12:21:11 Thariama

我要试试看看它是怎么回事。也许有些时候，因为我正在度假，直到星期一开始几个小时。 - 如果我能用这些空白和所有东西来为我工作，在我可以接受这个答案之前，我想对代码进行一些编辑。 var声明char/node/doc/new_element，===而不是==字符串进行比较，最后的分号就是我目前所看到的。 – 2010-08-19 13:45:29

突出显示/格式textareas

回答

相关问题