function searchAndHighlight(searchTerm, selector) {
if (searchTerm) {
//var wholeWordOnly = new RegExp("\\g"+searchTerm+"\\g","ig"); //matches whole word only
//var anyCharacter = new RegExp("\\g["+searchTerm+"]\\g","ig"); //matches any word with any of search chars characters
var selector = selector || "#realTimeContents"; //use body as selector if none provided
var searchTermRegEx = new RegExp(searchTerm, "ig");
var matches = $(selector).text().match(searchTermRegEx);
if (matches != null && matches.length > 0) {
$('.highlighted').removeClass('highlighted'); //Remove old search highlights
//Remove the previous matches
$span = $('#realTimeContents span');
$span.replaceWith($span.html());
if (searchTerm === "&") {
searchTerm = "&";
searchTermRegEx = new RegExp(searchTerm, "ig");
}
$(selector).html($(selector).html().replace(searchTermRegEx, "<span class='match'>" + searchTerm + "</span>"));
$('.match:first').addClass('highlighted');
$('.next_h').addClass('visible');
var i = 0;
$('.next_h').off('click').on('click', function () {
i++;
if (i >= $('.match').length) i = 0;
$('.match').removeClass('highlighted');
$('.match').eq(i).addClass('highlighted');
$('.ui-mobile-viewport').animate({
scrollTop: $('.match').eq(i).offset().top
});
});
$(".next_h").click(function () {
$([document.documentElement, document.body]).animate({
scrollTop: $(".highlighted:first").offset().top
});
});
if ($('.highlighted:first').length) {
$(window).scrollTop($('.highlighted:first').position().top);
}
return true;
}
}
return false;
}
$(document).on('click', '.searchButtonClickText_h', function (event) {
$('.searchButtonClickText_h').addClass('novisibity');
$(".next_h").css("visibility");
$(".highlighted").removeClass("highlighted").removeClass("match");
if (!searchAndHighlight($('.textSearchvalue_h').val())) {
alert("No results found");
}
});
$(document).on('click', '.textSearchvalue_h', function (event) {
$(".next_h").removeClass('visible');
$('.searchButtonClickText_h').removeClass('novisibity');
$(".highlighted").removeClass("highlighted").removeClass("match");
});
Использую этот код для поиска слов на странице, но если в поисковую сроку повторно задать новое слово для поиска, при переходе между найденными словами экран начинает прыгать верх в низ, и после прыжков останавливается на найденном слове. Я подозреваю что это проблема в animate
и его сочетании с scrollTop
. Как это можно исправить