Poczekaj na funkcję, aż użytkownik przestanie pisać

Question

Mam użytkowników wykonujących połączenie ajax podczas pisania. Problemem jest to, że sprawia, że ​​zaproszenie do każdego listu pisanego, więc mogę ustawić limit czasu tak:

$(input).live('keyup', function(e){ 

setTimeout(function(){ 

var xx = $(input).val(); 
doSearch(xx); 

}, 400); 

}); 

To nie czekać na 400ms ale następnie wykonuje dla każdego keyup. Jak mogę to zmienić, aby wywoływać ajax tylko "raz" około 400 ms po ostatniej wpisanej literze?

(użyłem „opóźnienie” w przeszłości, ale to nie działa w ogóle z mojego skryptu ...)

Answer 1

timer = 0; 
function mySearch(){ 
    var xx = $(input).val(); 
    doSearch(xx); 
} 
$(input).live('keyup', function(e){ 
    if (timer) { 
     clearTimeout(timer); 
    } 
    timer = setTimeout(mySearch, 400); 
}); 

lepiej przenieść funkcji w nazwie funkcji i wywołać ją wiele razy, bo inaczej jesteś tworząc inną funkcję lambda na każdym keyup co jest niepotrzebne i stosunkowo drogie

Answer 2

Trzeba zresetować licznik za każdym razem nowy klucz jest wciśnięty, na przykład

(function() { 
    var timer = null; 

    $(input).live('keyup', function(e) { 
     timer = setTimeout(..., 400); 
    }); 

    $(input).live('keydown', function(e) { 
     clearTimeout(timer); 
    }); 
)(); 

Wyrażenie Funkcja ta jest wykorzystywana w celu zapewnienia, że ​​zakres tego timer zmiennej jest ograniczony do tych dwóch funkcji, które jej potrzebują.

Answer 3

Myślę, że możesz może ponownie użyć w tym kontekście tak długo, jak jesteś w porządku z dodaniem nowego tymczasowego "czegoś" do miksu. Czy to działa dla ciebie?

$(input).live('keyup', function(e) { 
    if (!$(input).hasClass("outRunningAJob")) { 
     var xx = $(input).val(); 
     $(input).addClass("outRunningAJob"); 
     doSearch(xx); 
     $(input).delay(400).queue(function() { 
      $(this).removeClass("outRunningAJob"); 
      $(this).dequeue(); 
     }); 
    } 
}); 

Answer 4

znalazłem następujące łatwiejsze do wdrożenia:

$(input).on('keyup', function() { 
    delay(function() { 
     if (input).val() !== '' && $(input).val() !== $(input).attr('searchString')) { 
      // make the AJAX call at this time 
      // Store the value sent so we can compare when JSON returns 
      $(input).attr('searchString', $(input).val()); 

      namepicker2_Search_Prep(input); 
     } 
    }, 500); 
}); 

Dzięki przechowywaniu bieżący ciąg jesteś w stanie zobaczyć, że użytkownik przestał pisać. Następnie możesz bezpiecznie wywołać swoją funkcję, aby zrobić to, co kiedykolwiek musi się wydarzyć.