Text in HTML Field to disappear when clicked?

Question

I can easily create a html input field that has text already in it. But when the user clicks on the input field the text doesn't disappears but stays there. The user then has to manually remove the text to type. How can I create an input field where when the user clicks on the input field box the text then disappear?

Answer 1

How about something like this?

<input name="myvalue" type="text" onFocus="if(this.value=='enter value')this.value='';" value="enter value">

This will clear upon focusing the first time, but then won't clear on subsequent focuses after the user enters their value

Answer 2

To accomplish that, you can use the two events onfocus and onblur:

<input type="text" name="theName" value="DefaultValue" onblur="if(this.value == ''){ this.value = 'DefaultValue'; this.style.color = '#BBB';}" onfocus="if(this.value == 'DefaultValue'){ this.value = ''; this.style.color = '#000';}" style="color:#BBB;" />