В свое время была задача реализовать поисковую строку на сайте, которая бы работала не просто как поиск, а при попытке введении запроса выдавала бы подсказки-ссылки на конкретные страницы сайта.
Делается достаточно просто
- Через jQuery на событие keyup вешается функция отправки уже введенных пользователем данных при помощи Ajax’a на php-скрипт (+ здесь же можно реализовать проверку того, что алгоритм начнет работать только если пользователь ввел 3 или более символов)
- Пишется php скрипт, который находит в базе данных или из введенного вами перечня (можно даже из файла) подходящие результаты
- Через Ajax возвращаются результаты
Пример возможного кода:
<form id="form">
<input type="text" id="searchForm">
<ul id="searchHelper" style="display: none;"></ul>
</form>
<script type="text/javascript">
$('#searchForm').keyup(function(){
if($(this).val().length>3){
//заместо адреса можно перенаправлять на текущую страницу, при условии что на ней вызывается сниппет, перехватывающий ajax-значения
$.get('адрес_до_пхп_файла',{'query':$(this).val()},function(data){
data = eval('('+data+')');
if(data.length!=undefined && data.length>0){
$("#searchHelper").html('');
for(i in data){
$('#searchHelper').append('<li>'+data[i]+'</li>');
}
$('#searchHelper').css('display', 'block');
}
});
}
});
$('#searchHelper > li').live('click',function(){
$('#searchForm').val($(this).text());
$('#form').submit();
});
</script>