Javascript: Show Hide textbox text on focus

This might be simple one but it is a very handy code. Generally, I see this being used in Search textbox where there is some text like ‘search…’ by default. And, when you put the mouse cursor on the textbox, the text is removed and then you can type your desired search text.

For this, two javascript event handler are used: onFocus and onBlur.

onFocus: event handler used when the body of the page receives focus
onBlur: event handler used when the body of the page loses focus

Here is the code:-


<input type="text" name="search" value="search..." 
	   onFocus="if(this.value != '') {this.value = '';}" 
	   onBlur="if (this.value == '') {this.value = 'search...';}"
	/>

Hope this helps. Thanks.