HTML Clear Default Text in input text box

Written by Tony Lea on Feb 27th, 2010 Views Report Post

After several times of searching for a solution for clearing the default text from an HTML input text box several times and coming up with good results; however, some incompatible with some browsers. I had found some that worked well with all browsers; however, they had some cumbersome javascript files that I had to include.

Instead I decided to compile the best solution and the great thing about it is that you can put all the functionality within the single input tag. Here is the solution:

<input type="text" value="search..." size="26" onclick="this.value='';" onfocus="javascript: if (formfield.defaultValue==formfield.value)formfield.value = ''" onblur="this.value=!this.value?'search...':this.value;" />

This is a simple search textbox which will clear the default text when it has focus and when focus has been lost the default text will be returned. In this example the default text is "search...".

Comments (0)