Question

我正在进行文本的搜索功能。我正面临一个问题，实际上我第一次搜索它工作正常。但是当我再次搜索并按搜索时，它显示前一个搜索突出显示的文本。没有显示搜索文本如何解决这个问题。这是我的代码。 http://jsfiddle.net/ravi1989/z7fjW/143/

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 || "#bodyContainer";                             //use body as selector if none provided
        var searchTermRegEx = new RegExp(searchTerm,"ig");
        var matches = $(selector).text().match(searchTermRegEx);
        if(matches) {
$('.highlighted').removeClass('highlighted');     //Remove old search highlights
                $(selector).html($(selector).html().replace(searchTermRegEx, "<span class='match'>"+searchTerm+"</span>"));
           $('.match:first').addClass('highlighted');
            $('#next').on('click',i=1, function()
        {   alert(i); 
            $('.match').removeClass('highlighted');                                                                   $('.match').eq(i).addClass('highlighted');

          i=i+1; 
        k=i-2;
         alert(i);
     }); 
                  $('#previous').on('click',k=1, function()
        {   alert(k);
            $('.match').removeClass('highlighted');                                                                   $('.match').eq(k).addClass('highlighted');         
          k=k-1;
            i=k+2;
     });




            if($('.highlighted:first').length) {             //if match found, scroll to where the first one appears
                $(window).scrollTop($('.highlighted:first').position().top);
            }
            return true;
        }
    }
    return false;
}
$(document).ready(function() {
    $('#search-button').on("click",function() {
        if(!searchAndHighlight($('#search-term').val())) {
            alert("No results found");
        }
    });
});

Answer 1

在重新搜索之前，您应该删除搜索时为搜索突出显示的文本设置的所有类，否则这些类将保留：

$(".highlighted").removeClass("highlighted").removeClass("match");

小提琴：http://jsfiddle.net/z7fjW/144/

希望有所帮助

从页面搜索文本时不删除以前突出显示的（选定的）文本

1 个答案: