Remove Text from Textbox

Sometimes when designing a web page we may take the decision to place the instructions associated with a text box inside it. This takes up less space on the page and can make the intent of the box clearer. For example:

<input type="text" value="Search" ID="Text1" NAME="tbxSearch">

Now the user knows the purpose of the text box and the type of content to be entered. However, first the existing text must be deleted, before adding the required values. We can improve on this situation with a small piece of javascript to blank the content of the text box when a mouse is clicked inside it.

<input type="text" id= "tbxSearch" value="Search" OnClick=" this.value=''">

NAT February 2006