« Q & A page
« tech pages
|
Automatically clearing search/text boxes
by Mike Slocombe
Q: I've noticed that on some sites, simply clicking on a search box or a text box makes the displayed text instantly disappear. I want that for my site! How do I do it?
R Gibbons
A: This handy effect is achieved with just a few lines of JavaScript.
Firstly, add the following code in the <HEAD> </HEAD> part of your document:
<script type="text/javascript">
<!--
function clearDefault(el) {
if (el.defaultValue==el.value) el.value = ""
}
// -->
</script>
Then use this script in your search/text box:
<FORM>
Email: <INPUT TYPE=text VALUE="E-Mail Address" ONFOCUS="clearDefault(this)"><BR>
Search: <INPUT TYPE=text VALUE="Search Text" ONFOCUS="clearDefault(this)">
</FORM>
Here's an example of the script in action:
More info: Automatically Clear Default Form Values
May 2004
|