jQuery: ritardare l'esecuzione del codice dopo la pressione di un tasto

Immaginiamo questa situazione: dobbiamo validare l'input dell'utente abbinando un'azione alla pressione dei tasti. Non possiamo eseguire l'azione immediatamente perchè bloccheremmo l'utente. Occorre quindi ritardare l'esecuzione del codice di quel tanto che basta perchè questi digiti qualcosa. Come fare? Usiamo jQuery e i timer JavaScript. Vediamo come.

Creiamo la seguente funzione di utility:

var delay = (function() {
    var timer = 0;
    return function(callback, ms) {
        clearTimeout(timer);
        timer = setTimeout(callback, ms);
    };
})();

Questa funzione ritarda l'esecuzione del codice di callback usando il numero di millisecondi specificato. Ecco un esempio pratico:

$('input').on('keyup', function() {
    delay(function() {
        alert('1 second delay');
    }, 1000);
});

Potete osservare l'esempio finale in questa pagina.