2013-06-08 4 views
1

У меня есть следующий сценарий:Aborting в ожидании/накопившихся AJAX запросов с помощью JQuery

$(document).ready(function(){ 
    $('#input').keyup(function(){ 
     sendValue($(this).val()); 

    }); 

}); 
function sendValue(str){ 
    $.post("ajax.php",{ sendValue: str }, 
    function(data){ 
     $('#display').html(data.returnValue); 
    }, "json"); 

} 

Скрипт используется в момент времени поиска типа сценария (например, Google), поэтому он посылает довольно несколько избранных запросов сервер, как пользователь, в текстовом поле (хотя я уже использую pconnect, поэтому нет повторных соединений с данными).

Это довольно большая база данных, и каждое нажатие клавиши отправляется как запрос AJAX, поэтому он заканчивается массивным отставанием ожидающих запросов. Я бы хотел, чтобы он остановил/отменил все предыдущие запросы (если они не были отправлены обратно) каждый раз, когда он отправляет новый запрос.

Я смотрел xhr.abort(), но я уверен, что он просто остановит все запросы, которые еще не были отправлены (в отличие от того, чтобы сервер прекратил обработку). Вероятно, это нормально, но я до сих пор не знаю, как реализовать его в моем коде.

ответ

2

Вы можете использовать подход, подобный этому, для того, чтобы сохранить последний запрос в нек-глобальном масштабе:

function getSendValueFunction(){ 
    var lastRequest; 

    return function(str){ 
     if (lastRequest){ 
      lastRequest.abort(); // abort pending request 
     } 
     // assign pending request, when created 
     lastRequest = $.post("ajax.php",{ sendValue: str }, 
     function(data){ 
      lastRequest = null; // clear pending request 
      $('#display').html(data.returnValue); 
     }, "json"); 

    } 
} 

var sendValue = getSendValueFunction(); 

Просто помните, что getSendValueFunction возвращает функции, которые имеют отдельные регистры последнего отложенного запроса. Таким образом, это приведет к тому, что у них будет два разных ожидающих запроса, полностью разделенных:

var sendValue1 = getSendValueFunction(); 
var sendValue2 = getSendValueFunction(); 
sendValue1('aaa'); 
sendValue2('bbb'); 
Смежные вопросы