Cómo usar el atributo "autofocus" en HTML 5

Entendamos por “autofocus” como la acción de dirigir el enfoque a un elemento de la página, esto permitirá por ejemplo, mostrar el cursor en un cuadro de texto específico de un formulario para que el usuario empiece a ingresar algún dato.

HTML 5 ha incorporado una serie de atributos que anteriormente exigían conocimientos adicionales de JavaScript y su método “Focus”, o en su defecto usar Flash y su lenguaje ActionScript, y aunque no son complicados sí exigían la implementación e inserción de un script adicional o hasta tener alguna aplicación adicional instalada en nuestro ordenador.

El atributo “autofocus” es de tipo booleano (o es verdadero o es falso) y muy sencillo de implementar, por ejemplo, si en el formulario deseamos enfocar inmediatamente se cargue la página un cuadro de texto, un botón o un área de texto usaríamos respectivamente una de las siguientes instrucciones:

<input type=”text” name=”clave” id=”clave” autofocus=”autofocus” /><input type=”submit” name=”enviar” id=”enviar” value=”Enviar” autofocus=”autofocus” /> <textarea name=”mensaje” id=”mensaje” autofocus=”autofocus”></textarea>

Claro que podríamos seguir usando JavaScript para añadir algún efecto particular, pero para el enfoque realmente es suficiente usar solamente este atributo.

Esta funcionalidad es útil en páginas en donde es evidente el ingreso de datos de parte del usuario como en la página de Google o un formulario de autenticación para que ingrese su nombre de usuario y contraseña, o también para guiar al usuario en la activación de algún servicio o para que se registre en el sitio web por ejemplo.

[post_ad]