javascript - 替换方法无需 html 格式，但可以使用格式

Question

当用户单击单元格值时，我尝试替换文本的颜色。似乎当我尝试在 html 中使用格式时，它停止工作，但是，它在没有格式的情况下工作得很好。 JSFiddles 将帮助您理解我正在讨论的内容。在此之前，我想先提几点:

1. 当我不格式化时，我只是使用

   <div id='jqxPanel' style=" font-size: 13px; font-family: Verdana;"> My content here </div>和var text = panel.text();

2. 当我使用格式化时，我正在使用

   <div id='jqxPanel' style=" font-size: 13px; font-family: Verdana;"><div style="margin: 10px;"><pre>My content here </pre></div></div>和var text = panel.html();

这是工作 JSFiddle没有任何格式且不起作用JSFiddle具有格式化功能。如何使不工作的 JSFiddle 正常工作以便我可以看到突出显示的文本？

Answer 1

我更新了您的JSFiddle

$("#jqxgrid").on("cellclick", function (event) 
                   {
    var value = event.args.value;
    var color = "#FF0000";
    var highlighted =                  
        text.replace( new RegExp(value, 'ig' ), '<span style="color:' + color + ';">' + value + '</span>');

    panel.jqxPanel('clearcontent');
    panel.jqxPanel('append', highlighted);
  });  

您正在尝试替换“something”而不是“something”(注意空格)。您在搜索字符串和替换字符串中都执行此操作。

此外，替换函数区分大小写。我添加了一个正则表达式以使其不区分大小写。

但是，这只是一个示例，您可以看到它用按钮的大小写替换了文本，因此“PATIENT”将突出显示“Patient”。