HTML Form input boxes clear when clicked

Here's a quick tip on clearing the default text from text boxes in a form.

First of all you can add the default text to a input box by declaring a value:

<input type="text" value="Enter Name" />

Now we can add an 'onfocus' event that will delete this value when the box is clicked, essentially by replacing it with nothing.

<input type="text" value="Enter Name" onfocus="if ( this.value=='Enter Name' ) { this.value = ''; }"/>

note: where it states the second this.value they're two single quotes '  ' and the statement is wrapped in double quotes. The two single quotes with no space between is for the value zero.

So now the text box appears with the tag 'Enter Name' inside it but when the user clicks the box the text disappears. This also works really well for search boxes eg- 'Search my site'.