Idiomatic jQuery delayed event (only after a short pause in typing)? (aka timewatch/typewatch/keywatch) Idiomatic jQuery delayed event (only after a short pause in typing)? (aka timewatch/typewatch/keywatch) jquery jquery

Idiomatic jQuery delayed event (only after a short pause in typing)? (aka timewatch/typewatch/keywatch)


I frequently use the following approach, a simple function to execute a callback, after the user has stopped typing for a specified amount of time::

$(selector).keyup(function () {  typewatch(function () {    // executed only 500 ms after the last keyup event.  }, 500);});

Implementation:

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

I think this approach is very simple, and it doesn't imply any global variables.

For more sophisticated usages, give a look to the jQuery TypeWatch Plugin.


Have a look at the excellent Text Change Event plugin from Zurb, purveyors of the highest quality jQuery goods.


This is a more good way to do it, without using the plugin:

var timeout;$('input[type=text]').keypress(function() {if(timeout) {    clearTimeout(timeout);    timeout = null;}timeout = setTimeout(myFunction, 5000)})