Un textField ó campo de texto no es mas que un elemente más de los demás que se pueden aplicar a un formulario en HTML, estos elementos suelen tener un valor inicial, el cual solo se puede borrar al entrar ó enfocarse (focus) en el elemento, seleccionar el texto y luego borrarlo como cualquier otro texto.

Vaciar un textField al enfocarse en el

Lo que trato de enseñar en este tip de HTML, es como usar el parámetro “onFocus” para aplicarlo a un campo de texto de tal forma que el enfocarse sobre él, éste se vacíe.

Esto puede parecer muy insignificante, pero sin duda es otro pequeño detalle que podría hacer más usable nuestro sitio, puesto que supongo que todos prefirieramos que el campo de texto se vaciara al hacer click sobre el, en lugar de tener que seleccionar el texto y luego borrarlo para por fin poder escribir.

Como ejemplo tomaré un formulario de motor de búsqueda de mi blog de WordPress; el código sería este:
<form id="buscar" action="http://www.ray-page.site40.net/" method="get">
<input id="t" name="s" type="text" value="Buscar" />
<input id="b" type="submit" value=" " />
</form>
Para evitar tanto código solo puse el de el formulario, ignoremos todas las etiquetas, con excepción de esta:
<input id="t" name="s" type="text" value="Buscar" />
Como ven el valor predeterminado del campo de búsqueda es “Buscar”, y para que al enfocarnos en el textField éste se vacíe solo agregamos este parámetro a su etiqueta:
onfocus="if (this.value == 'Buscar') {this.value = '';}"
Muy fácil de comprender ¿cierto?
Literalmente lo leemos así, “Al enfocarse, si el valor de esto es Buscar, el valor será *nada*”

Con esto bastará para que el campo se vacíe sin necesidad de usar scripts externos no nada de eso.

Pero si ahora buscamos que al desenfocarse ó salirse del elemento, éste se vuelva a rellenar con el texto “Buscar”, en el mismo elemento agregamos esta línea:
onblur="if (this.value == '') {this.value = 'Buscar';}"
Y lo leemos así, “Al desenfocarse, si el valor de esto es *nada*, el valor será Buscar”

Con esto tenemos una caja de búsqueda más usable ^_____^
<input id="t" name="s" type="text" value="Buscar" />
Como ven es algo muy pequeño, pero que sin duda vuelve ligeramente más usable tu sitio.