在文本区或文本输入中高亮显示的多色文本 [英] Multicolor Text Highlighting in a Textarea or Text Input

问题描述

我想在textarea或文本输入中使用不同的颜色设置文本（一个或另一个很好，我不需要两个）。想一想像简单的语法高亮。所以，让我们说，我有一些关键字定义。我希望这些单词的颜色不同于用户在textarea或文本输入中输入的颜色。

I'd like to set text in a textarea or text input using different colors (one or the other is fine, I don't need both). Think of something like simple syntax highlighting. So, let's say I have some keywords defined. I'd like those words to be colored a different color as the user types into the textarea or text input

我理解这需要一些CSS，Javascript，和可能一些精灵尘埃。

I understand this needs to be some combination of CSS, Javascript, and maybe some pixie dust. I wondering which direction I need to dig into to find out how this can be done.

谢谢

推荐答案

不，你不能在textarea或文本输入中这样做。任何CSS文本相关的属性将影响textarea / input中的整个文本。您将需要一个可编辑的元素或文档来实现语法高亮。示例（适用于所有最近的浏览器;最后一个主要浏览器不支持 contenteditable 是Firefox 2.0）：

No, you can't do this in a textarea or text input. Any CSS text-related property will affect the whole text within the the textarea/input. You'll need an editable element or document to achieve syntax highlighting. Example (works in all recent browsers; the last major browser not to support contenteditable was Firefox 2.0):

<code contenteditable="true">
    <span style="color: blue">var</span> foo = <span style="color: green">"bar"</span>;
</code>

这篇关于在文本区或文本输入中高亮显示的多色文本的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！