Мучаюсь уже несколько дней.
Нужно реализовать поиск слова в тексте, выделить и подсчитать найденные слова в тексте. Ко всему, нужно чтобы без перезагрузки страницы можно было ввести новое слово, старый поиск сброситься и будет выдан новый результат с учетом нового слова.
Есть код поиска слова в тексте и выделения его цветом:
(function($) {
$.fn.highlight = function(words, settings) {
// default настройки
var highlight_settings = {
split: ' ',
className: 'highlight',
deafultpagetext : null,
caseSensitive: false
};
highlight_settings = $.extend(highlight_settings, settings);
function wordsHighlight(node, words) {
// Если поиск в тексте
if (node.nodeType == 3) {
var regexp = new RegExp("(" + words.replace(new RegExp(highlight_settings.split, 'g'), "|") +")",
(highlight_settings.caseSensitive ? "" : "i") + "g");
var str = $('<div></div>').text(node.data).html();
$(node).replaceWith(str.replace(regexp, '<span id="kwh" class="' + highlight_settings.className + '">$1</span>'));
// Если поиск в тегах
}
}
return this.each(function() {
wordsHighlight(this, words);
});
};
})(jQuery);
Далее вызываю из нужной мне страницы с текстом:
$(document).ready(function(){
$("#wordznalyze").click(function(){
$("#pagetext").highlight($("#kword").val());
});
});
<DIV class='words'>
<DIV class='col2'>
<DIV>Введите ключевое слово:</DIV>
<DIV><INPUT type='text' id='kword'></DIV>
</DIV>
<DIV class='col2'>
<DIV>Кол-во вхождений:</DIV>
<DIV id='wordcount'></DIV>
</DIV>
<DIV class='col3'><INPUT type='submit' id='wordsearch' value="Анализировать"></DIV>
</DIV>
Собственно, слова ищутся, но единожды (т.е. при вводе нового слова, в тексте остаются выделенными старые слова). Но главное, не знаю как подсчитать количество совпадений слова в тексте.
