Textarea或文本输入中的多色文本突出显示

一尘不染

html

我想在文本区域或使用不同颜色的文本输入中设置文本（一种或另一种都可以，我不需要两者都可以）。想想简单语法高亮之类的东西。因此，假设我定义了一些关键字。我希望当用户在文本区域或文本输入中键入这些单词时，使用不同的颜色进行着色

我知道这需要结合CSS，Javascript和一些小技巧。我想知道我需要深入研究哪个方向才能找到解决方案。

谢谢

阅读 321

2020-05-10

共1个答案

一尘不染

不，您不能在文本区域或文本输入中执行此操作。任何与CSS文本相关的属性都将影响textarea /
input中的整个文本。您需要一个可编辑的元素或文档来实现语法突出显示。示例（在所有最新的浏览器中都可用；最近的不支持的主要浏览器contenteditable是Firefox
2.0）：

<code contenteditable="true">

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

</code>

2020-05-10