Как оптимизировать AJAX поиск по сайту?

Здравствуйте.

Есть поле с навешенным событием keyup. При вводе отправляется AJAX запрос на сервер, где получается какая-то информация из базы по любому вхождению отправленной строки и возвращается на клиент в виде JSON. Стандартное решение. Какие есть простые способы оптимизации данного поиска? Например, чтобы запросы не отправлялись после каждого нажатия кнопки.
  • Вопрос задан
  • 2697 просмотров
Пригласить эксперта
Ответы на вопрос 3
mrRontgen
@mrRontgen
Scala lover.
//
// $('#element').donetyping(callback[, timeout=1000])
// Fires callback when a user has finished typing. This is determined by the time elapsed
// since the last keystroke and timeout parameter or the blur event--whichever comes first.
//   callback: function to be called when even triggers
//   timeout:  (default=1000) timeout, in ms, to to wait before triggering event if not
//              caused by blur.
// Requires jQuery 1.7+
//
;(function($){
    $.fn.extend({
        donetyping: function(callback,timeout){
            timeout = timeout || 1e3; // 1 second default timeout
            var timeoutReference,
                doneTyping = function(el){
                    if (!timeoutReference) return;
                    timeoutReference = null;
                    callback.call(el);
                };
            return this.each(function(i,el){
                var $el = $(el);
                // Chrome Fix (Use keyup over keypress to detect backspace)
                // thank you @palerdot
                $el.is(':input') && $el.on('keyup keypress',function(e){
                    // This catches the backspace button in chrome, but also prevents
                    // the event from triggering too premptively. Without this line,
                    // using tab/shift+tab will make the focused element fire the callback.
                    if (e.type=='keyup' && e.keyCode!=8) return;
                    
                    // Check if timeout has been set. If it has, "reset" the clock and
                    // start over again.
                    if (timeoutReference) clearTimeout(timeoutReference);
                    timeoutReference = setTimeout(function(){
                        // if we made it here, our timeout has elapsed. Fire the
                        // callback
                        doneTyping(el);
                    }, timeout);
                }).on('blur',function(){
                    // If we can, fire the event since we're leaving the field
                    doneTyping(el);
                });
            });
        }
    });
})(jQuery);

$('#example').donetyping(function(){
  $('#example-output').text('Event last fired @ ' + (new Date().toUTCString()));
});


Взято вот отсюда stackoverflow.com/questions/14042193/how-to-trigge...
Ответ написан
passshift
@passshift
php, js, html5, css
Можно начинать искать после 4-ого введенного символа. В идеале конечно после нажатия на кнопку "поиск", но это нынче не модно, все хотят "живой" поиск.

"любому вхождению отправленной строки" - вот тут уже могут быть ошибки. Нужно помечать индексом поля по которым ведется поиск и желательно искать только после слова + я предлагаю (не знаю как у Вас) сделать разделение категорий поиска:

Ну допустим поиск по людям отдельно, поиск по темам, поиск по группам и т.д. все отдельно... пусть выбирают из выпадающего списка и вбивают поисковой запрос.

При таком раскладе все должно быть хорошо.
Ответ написан
@asdz
Это вам поможет.
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы