Выделите акцентированные символы - PullRequest
4 голосов
/ 23 мая 2011

Я использую плагин jquery.highlight: http://code.google.com/p/gce-empire/source/browse/trunk/jquery.highlight.js?r=2

Когда я ищу слово с акцентом, например "café", он не выделяет совпадения с "cafe" ... Хотя с "cafe" работает нормально ... Итак, я хочу иметь возможность выделить акцентированные слова ... Любая идея о том, как это сделать с этим плагин?

Спасибо!

EDIT Хорошо, это работает, но мне пришлось добавить пробел между первым "(" и последним ")" в переменных "pattern" и "patternNoAccents", потому что, если в начале или в конце был акцентированный символ словом, это не сработает (например, «кафе»)

Проблема в том, что оно выделяет слово И пробел до и после. Есть ли другое решение?

jQuery.extend({
            highlight: function (node, re, nodeName, className) {
                if (node.nodeType === 3) {
                    var match = node.data.match(re);
                    if (match) {
                        var highlight = document.createElement(nodeName || 'span');
                        highlight.className = className || 'highlight';
                        var wordNode = node.splitText(match.index);
                        wordNode.splitText(match[0].length);
                        var wordClone = wordNode.cloneNode(true);
                        highlight.appendChild(wordClone);
                        wordNode.parentNode.replaceChild(highlight, wordNode);
                        return 1; //skip added node in parent
                    }
                } else if ((node.nodeType === 1 && node.childNodes) && // only element nodes that have children
                        !/(script|style)/i.test(node.tagName) && // ignore script and style nodes
                        !(node.tagName === nodeName.toUpperCase() && node.className === className)) { // skip if already highlighted
                    for (var i = 0; i < node.childNodes.length; i++) {
                        i += jQuery.highlight(node.childNodes[i], re, nodeName, className);
                    }
                }
                return 0;
            }
        });

        jQuery.fn.unhighlight = function (options) {
            var settings = { className: 'highlight', element: 'span' };
            jQuery.extend(settings, options);

            return this.find(settings.element + "." + settings.className).each(function () {
                var parent = this.parentNode;
                parent.replaceChild(this.firstChild, this);
                parent.normalize();
            }).end();
        };

        function stripAccents(str) { 
                var rExps=[ 
                {re:/[\xC0-\xC6]/g, ch:'A'}, 
                {re:/[\xE0-\xE6]/g, ch:'a'}, 
                {re:/[\xC8-\xCB]/g, ch:'E'}, 
                {re:/[\xE8-\xEB]/g, ch:'e'}, 
                {re:/[\xCC-\xCF]/g, ch:'I'}, 
                {re:/[\xEC-\xEF]/g, ch:'i'}, 
                {re:/[\xD2-\xD6]/g, ch:'O'}, 
                {re:/[\xF2-\xF6]/g, ch:'o'}, 
                {re:/[\xD9-\xDC]/g, ch:'U'}, 
                {re:/[\xF9-\xFC]/g, ch:'u'}, 
                {re:/[\xD1]/g, ch:'N'}, 
                {re:/[\xF1]/g, ch:'n'} ]; 
                for(var i=0, len=rExps.length; i<len; i++) 
                        str=str.replace(rExps[i].re, rExps[i].ch); 
                return str; 
        };

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

            if (words.constructor === String) {
                words = [words];
            }
            words = jQuery.grep(words, function(word, i){
              return word != '';
            });
            words = jQuery.map(words, function(word, i) {
              return word.replace(/[-[\]{}()*+?.,\\^$|#\s]/g, "\\$&");
            });
            wordsNoAccents = jQuery.map(words, function(word, i) {
              return stripAccents(word);
            });

            if (words.length == 0) { return this; };

            var flag = settings.caseSensitive ? "" : "i";
            var pattern = "( " + words.join("|") + " )";

            if (settings.wordsOnly) {
                pattern = "\\b" + pattern + "\\b";
            }

            var patternNoAccents = "( " + wordsNoAccents.join("|") + " )";

            if (settings.wordsOnly) {
                patternNoAccents = "\\b" + patternNoAccents + "\\b";
            }

            var re = new RegExp(pattern, flag);
            var reNA = new RegExp(patternNoAccents, flag);

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

Ответы [ 3 ]

2 голосов
/ 23 мая 2011

Проверьте этот пример.http://jsfiddle.net/bNPjQ/ Он выделит кафе и кафе, если вы перейдете в кафе.Не уверен, что это желаемая функция, но я могу вам помочь, если вы хотите, чтобы она выделяла только Café.

Я начал с исходного плагина, добавил вашу функцию stripAccents, изменил одну строку и добавил вызовраздеть акценты в функции выделения.Я пометил все, что я изменил, комментарием.

Когда вы запустите его, он сделает выделение без wordsOnly, затем через 2 секунды отменит выделение и сделает еще одно выделение с wordsOnly.

0 голосов
/ 02 апреля 2014

Использование http://highlightjs.org/ Простота в использовании и множество вариантов для выделения

0 голосов
/ 23 мая 2011

Вы должны ввести код специального символа HTML в тексте.

Например:

Caf&eacute;

Затем в селекторе для примера плагина выделения ниже:

<a href="javascript:void($('#highlight-plugin').removeHighlight().highlight('Caf&eacute;'));">highlight</a>

Только что протестировал его, и он выделяет все экземпляры Café в документе.

...