Using Delay on a textbox

Question

I am trying to build a functionality where a user types text in the textbox and after a delay of 1 second, each character typed is converted to its upper case. This should happen as the user types.

Can i do using jquery?

Answer 1

This might not be the most jQuery-esque way to do it, but something like this.

setInterval((function (textbox) {
    return function () {
        textbox.val(textbox.val().toUpperCase());
    }
}($("#myTextBox"))), 1000);

Of course changing $("#myTextBox") to the relevant selector

Answer 2

Check out the answer to this question for more detail:

How to delay the .keyup() handler until the user stops typing?

But here is a full working example of it all tied together:

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

       $("#testerText").keyup(
           function()
           {
                delay(function()
                {
                    $("#testerText").val($("#testerText").val().toUpperCase());
                }, 1000);
           });
    });

http://jsfiddle.net/5Nq2f/