Javascript + JQuery: Verificador se usuário terminou de digitar

Olá,

Você já precisou de chamar uma função apenas quando o usuário termine de digitar todo o texto ?

O jQuery possui algumas funções interessantes, mas que sozinhas não tem o efeito que precisamos.

Existem algumas formas de fazer isso, abaixo o código de uma delas e como utilizar.

(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);

Como utilizar a função?

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

Segue funcionando no JSFIddle

Richardson Westphal

Formado em Sistemas de Informação pela FAESA em Vitória - ES. Falo Inglês fluente e estou aprendendo Alemão. Iniciei a programação na faculdade e apaixonado pelo que faço, continuo meu trabalho como freelancer e home-office.