使用jQuery，如何在用户键入时突出显示单词的所有新出现和现有出现？

我正在构建一个简单的笔记工具，其中某些关键字将在用户键入时自动突出显示，以便他们以后可以轻松找到它们

我已经创建了一个keyup函数，用于侦听文本区域并捕获现有内容，但我不确定如何突出显示一个单词或一组单词的所有新出现和现有出现

以下是我目前掌握的情况：

这似乎只是捕捉到了这个词的第一次出现，尽管仍然没有像它应该的那样突出显示。如果是部分匹配，则应突出显示整个单词，例如，测试也应突出显示关键字测试

扩展的目标是定义多个关键字和/或短语的数组，每个关键字和/或短语都将以适当的方式突出显示，最好使用不同的颜色

任何帮助都将不胜感激

您应该使用/test/g而不是.replace

以下是一个适用于您的案例的示例：

$txt.keyup函数{ var txt=$this.val； var关键字=测试； 如果txt.indexOfkeyword>-1{ $page.htmlText.replace/test/g，+关键字+； } 否则{ $page.htmltxt； } }; 身体{ 保证金：0； 填充：0； 字体系列：Inter，sans serif！重要； } 文本区{ 填充：12倍； 字体系列：Inter，无衬线； 字号：2em； 高度：1.4em； } .亮点{ 颜色：红色！重要； }

---

这太棒了。我不熟悉/test/g，所以我将详细了解它的工作原理。你有什么建议来调整它以突出部分匹配吗？因此，像测试这样的词语会在整体上突出显示，因为它们与部分测试相匹配。@Jon很高兴能提供帮助。是的，您可以使用/anykeyword/g查找并替换斜杠之间出现的所有内容。我也会研究这个问题。看看我能不能找到解决办法。

$("#txt").keyup(function() {
    var keyword = "test";

  var txt = $(this).val();
  $("#page").text(txt);

  var pos = $("#page").text().search(keyword);
    var pageTxt = $("#page").text();

    if(pos >= 0) { 
    pageTxt.substr(pos, keyword.length).replace('<span class="highlight">' + keyword + '</span>');
    console.log("Ran!");
  }
});