8

我正在使用 jquery.highlight 插件：http ://code.google.com/p/gce-empire/source/browse/trunk/jquery.highlight.js?r=2

我用它来突出显示搜索结果。

问题是，如果我搜索“café”之类的内容，它不会突出显示任何单词。

如果我搜索"cafe"，即使我的结果同时包含"cafe"和"cafe"，它也只会突出显示 "cafe"。

因此，我需要突出显示单词的所有“版本”，无论是否带有变音符号。

那可能吗？

4

2 回答 2

4

http://jsfiddle.net/nHGU6/

测试 HTML：

<div id="wrapper-accent-sensitive">
 <p>咖啡厅</p>
 <p>asdf</p>
 <p>咖啡厅</p>
</div>
<hr />
<div id="wrapper-not-accent-sensitive">>
 <p>咖啡厅</p>
 <p>asdf</p>
 <p>咖啡厅</p>
</div>

测试 CSS：

。黄色 {
    背景颜色：#ffff00；
}

替换Javascript：

jQuery.fn.highlight = function (words, options) {
    var accentedForms = {
        'c': 'ç',
        'e': 'é'
    };

    var settings = { className: 'highlight', element: 'span', caseSensitive: false, wordsOnly: false, accentInsensitive: false };
    jQuery.extend(settings, options);

    if (settings.accentInsensitive) {
        for (var s in accentedForms) {
            words = words.replace(s, '[' + s + accentedForms[s] + ']');
        }
    }

    if (words.constructor === String) {
        words = [words];
    }

    var flag = settings.caseSensitive ? "" : "i";
    var pattern = "(" + words.join("|") + ")";
    if (settings.wordsOnly) {
        pattern = "\\b" + pattern + "\\b";
    }
    var re = new RegExp(pattern, flag);

    return this.each(function () {
        jQuery.highlight(this, re, settings.element, settings.className);
    });
};

测试代码：

$(document).ready(function() {
    $("#wrapper-accent-sensitive").highlight("cafe", { className: 'yellow' });
    $("#wrapper-not-accent-sensitive").highlight("cafe", { className: 'yellow', accentInsensitive: true });
});
于 2011-05-21T01:22:44.460 回答
0

我可以推荐一个开箱即用的好库：highlight.js。虽然它旨在为代码块进行语法突出显示，但您也可以通过定义相应的语言语法语法来突出显示其他（关键字）词。

例如，在您的语言规范中设置选项lexemes : '[äöüÄÖÜßa-zA-Z]+'将启用带有德语特殊字符的关键字。

于 2018-09-27T12:43:49.050 回答