Jak dławić oddzwonienie zdarzenia jQuery?

Question

Ok, więc szukam jak w Google, wpisujesz tekst na wejściu i natychmiast podajesz wpisy. Ale tego nie lubię. Używam czegoś takiego: $("TEXTINPUT").keyup(function() {. Gdy użytkownik pisze bardzo szybko, łączy się z bazą danych wiele razy. Czy jest możliwe, że połączymy się z plikiem PHP tylko wtedy, gdy użytkownik przestanie pisać przez 1-2 sekundy, ale nie od razu? Muszę to zrobić w jQuery. Dzięki.

Answer 1

Spróbuj:

var time_out; 
$("TEXTINPUT").keyup(function(){ 
    clearTimeout(time_out); 
    time_out = setTimeout(your_function, 500); 
} 

function your_function() 
{ 
    /*CHECK DATABASE*/ 
} 

Answer 2

Oto jak to zwykle zbliżyć go:

$(function(){ 
    var tiTO, jqXHR; 
    $('textinput').keyup(function(){ 
    if (tiTO) clearTimeout(tiTO); 
    if (jqXHR && jqXHR.abort) jqXHR.abort(); 
    tiTO = setTimeout(function(){ 
     jqXHR = $.ajax({....}); 
     //Ajax call to PHP 
    },2000); 
    }); 
}); 

Każdy keyup resetuje limit czasu i przerywa żadnego aktywnego ajax.

Answer 3

Jeśli używasz Underscore Library jest to tak proste, jak to:

$("TEXTINPUT").keyup(_.throttle(function() {...}, 150));

Docs z witryny podkreślenia:

przepustnicy     _.throttle (funkcja, czekaj)

Zwraca dławiony w wersji z funkcji, które, gdy wywoływany wielokrotnie , tylko rzeczywiście wywołać funkcję owinięte co najwyżej raz na każde czekają milisekund. Przydatny w przypadku zdarzeń ograniczających szybkość, które pojawiają się szybciej niż jest to możliwe.

Istnieje również debounce funkcja:

nieczułości     _.debounce (funkcja, czekaj)

Wywołanie debounced funkcję będzie odroczyć jego wykonanie, aż po czekać milisekund mieć minęło od ostatniego wywołania funkcji . Przydatny do implementacji zachowania, które powinno się zdarzyć tylko po zatrzymaniu wprowadzania danych. Na przykład: renderowania podglądu z komentarzem Markdown, przeliczania układ po szyba przestał być zmieniany ...

Answer 4

Funkcja ta będzie działać trochę jak underscore.js, ale bez dodatkowego uzależnienia. Przekaże także zakres i argumenty, które wywołuje, do funkcji zawijanej. W odróżnieniu od odpowiedzi YoannM, zwraca ona samoistne wywołanie zwrotne, które nie używa żadnych zmiennych zewnętrznych (EG, używaj tyle razy, ile chcesz).

function throttle (func, wait) { 
    return function() { 
     var that = this, 
      args = [].slice(arguments); 

     clearTimeout(func._throttleTimeout); 

     func._throttleTimeout = setTimeout(function() { 
      func.apply(that, args); 
     }, wait); 
    }; 
} 

Używanie byłoby prawie identyczne z biblioteką underscore.js.

$('input').on('input keyup', throttle(function() { 
    // ... 
}, 100));