jQuery remove text in input on focus

The next code needs jQuery to be included:

jQuery(function($){
	var search = $('.search input.text'); // input text field
	var default_value = search.val();
	search.focus(function(){
		if ($.trim($(search).val()) == default_value) search.val('');
	});
	search.blur(function(){
		if ($.trim($(search).val()) == '') search.val(default_value);
	});
});

Or just use placeholder html5 feature:

<form>
	<input name="q" placeholder="search...">
	<input type="submit" value="search">
</form>

Test html5 placeholder example (works in chrome, opera, firefox):

Leave a Reply

Your email address will not be published. Required fields are marked *

*

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> <pre lang="" line="" escaped="" highlight="">