通过关键字搜索突出显示数据网格上所有匹配的字符串/子字符串 [英] Highlight all matching strings/substrings on a datagrid from a keyword search

问题描述

有人可以帮助我如何从关键字搜索中突出显示匹配的字符串/子字符串吗?

Can someone help me on how to highlight the matching strings/substrings from a keyword search?

例如，如果用户输入"BEARING"，则数据网格应显示以下内容

For example if the user inputs "BEARING", the datagrid should display the following

适配器轴承

BAR AIR * Bearing * Turn

BAR AIR*BEARING* TURN

轴承球

轴承铜牌

我快要完成了，但是在这个示例中，应该突出显示整个AIRBEARING，应该仅突出显示BEARING.

I am almost finish but in this example, the whole AIRBEARING is highlighted which supposed to be, it is only the BEARING that should be highlighted only.

推荐答案

创建一个CSS类，并将其称为突出显示":

Create a css class and call it 'highlight':

.highlight { background-color: yellow; }

然后使用正则表达式替换将此类文本包装为类:

Then use a regex replace to wrap that text with the class:

function highlight(walloftext, valuetohighlight) {
    var x = new RegExp("(" + valuetohighlight + ")", "gi");
    return walloftext.replace(x, '<span class="highlight">$1</span>');
}

http://jsfiddle.net/rkw79/5cCuc/

这篇关于通过关键字搜索突出显示数据网格上所有匹配的字符串/子字符串的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！