2010-06-26 6 views
0

Я пытаюсь выделить текст, соответствующий запросу, в режиме реального времени, используя jquery.highlight. Живой поиск работает отлично, но стиль для подсветки применяется, тогда он исчезает. Я делаю что-то неправильно?Выделить прямые результаты поиска

JQuery

$(document).ready(function() { 
    $("#search").bind("keyup", function() { 
    var form = $(this).parents("form"); 
    var query = $(this).val(); 
    var formData = form.serialize(); 

    $.post("https://stackoverflow.com/questions/new/search", formData, function(html) { 
     $("#questionList").html(html); 
    }); 

    $(".question").highlight(query); 
    }); 
}); 

HTML

<form action="/questions" method="get"> 
    <input id="search" name="search" type="text" /> 
</form> 

<div id="questionList"> 
    <div class="question">What is the 1 + 1?</div> 
    <div class="answers">2</div> 
</div> 
+0

Взгляните на [mark.js] (https://markjs.io/) – dude

ответ

2

Да, вы должны выполнить $(".question").highlight(query) в обработчик ответа HTTP запрос сразу после $("#questionList").html(html) таким образом:

$(document).ready(function() { 
    $("#search").bind("keyup", function() { 
    var form = $(this).parents("form"); 
    var query = $(this).val(); 
    var formData = form.serialize(); 

    $.post("https://stackoverflow.com/questions/new/search", formData, function(html) { 
     $("#questionList").html(html); 
     $(".question").highlight(query); 
    }); 

    }); 
}); 
+0

Спасибо, что сделал трюк. – Soliah

Смежные вопросы