Crear una función javascript

Hola, como sería este código en una funcion javascript, para que me quede el HTML más limpio. Gracias de antemano:

<input type="text" name="usuario" id="usuario"  value="Escribe tu Nombre" 
    onfocus="if (this.value == 'Escribe tu Nombre') {
        this.value = ''; this.style.background = 'transparent'; }"
 
    onblur="if (this.value == '') {
        this.value = 'Escribe tu Nombre';
     this.style.background = 'url(imagenes/online-red-icon.png)no-repeat'; }">
 
<input type="text"  name="email" id="email"
    value="Escribe tu email" 
    onfocus="if (this.value == 'Escribe tu email') {
        this.value = ''; this.style.background = 'transparent'; }"
 
    onblur="if (this.value == '') {
        this.value = 'Escribe tu email';
     this.style.background = 'url(imagenes/descarga.png)no-repeat'; }">

Respuestas

#1

Buenas noches:

Realmente lo que quieres se hace sin necesidad de javascript, utilizando el atributo placeholder de los input. Lo del fondo, por css.

En principio, sin probarlo, creo que esto sería lo que buscas.

Un saludo.

<style>
    #usuario { background: url(imagenes/online-red-icon.png)no-repeat }
    #email { background: url(imagenes/descarga.png)no-repeat }
    #usuario:focus, #email:focus { background: transparent }    
</style>
 
<input type="text" name="usuario" id="usuario"  placeholder="Escribe tu Nombre"> 
<input type="email"  name="email" id="email" placeholder="Escribe tu email" >

@jesusjbm

23 septiembre 2015, 23:15

#2

Hola @jesusjbm, gracias por decirme cómo se hace con CSS, ahora ya se hacerlo de las dos formas. Gracias por tu aportación, Saludos.

@_analeblanc

24 septiembre 2015, 16:10

#3

De nada, un placer.

Saludos.

@jesusjbm

24 septiembre 2015, 20:49