One of the most useful thing on forms is an “autoselect” function. How is this work? Let’s assume that you have a standard search box:

When textbox is focused you can do three things:

1. Do nothing. Let the user to delete all text. Not good for lazy people, right?
2. Autoclear box. But if user want only to change a letter (typo) or add another word, then he should re-type all things. Not good for usability.
3. Autoselect box content. Is just like the user double clicks on the text. How can you do this? Read further to see

1
2
3
4
5
6
7
8
9
10
11
12
13
14

var initValue;
$(document).ready(function(){
$(':text').each(function(){
	$(this).focus(function(){
		initValue = $(this).attr('value');
		$(this).select();
	});
	$(this).blur(function(){
		if($(this).val() == ''){
			$(this).val(initValue);
		}
	});
});
});

What is the best thing with this? Well… If an user just leave the text box blank, that form is auto filled with previous value.

Pretty nice, huh? Well… I think is pretty useful too