¿Qué podría ser más fácil que configurar un formulario HTML que capture direcciones de correo electrónico, por ejemplo, para un boletín o notificaciones? Por supuesto, cree un error al escribir una dirección de correo electrónico en ese formulario y luego haga que su navegador recuerde esa dirección incorrecta para todos los formularios de registro.
Si desea validar las direcciones de correo electrónico ingresadas en su formulario pero evitar complicados retoques y secuencias de comandos, HTML5 le permite confiar en el navegador, sin esfuerzo y sin recurrir a JavaScript.
Validar direcciones de correo electrónico con HTML5
Para que los navegadores de los usuarios validen las direcciones de correo electrónico a medida que las ingresan en su formulario web HTML:
- Asegúrate de usar HTML5.
- Especifique el elemento de entrada del formulario de dirección de correo electrónico como tipo "correo electrónico". (Vea a continuación un ejemplo).
Los navegadores que no reconocen el tipo = "correo electrónico" deben (y, por lo que se puede decir, todos lo harán) tratar el campo de entrada como un campo ordinario de tipo "texto".
Advertencias de validación de direcciones de correo electrónico HTML5
Tenga en cuenta que la validación de direcciones de correo electrónico HTML solo funcionará en navegadores que admitan HTML5 y validen la entrada de elementos de formulario. Para otros navegadores y copias de seguridad, aún puede validar direcciones de correo electrónico usando PHP, por ejemplo.
Los navegadores que admiten la validación de direcciones de correo electrónico HTML5 incluyen Safari 5+, Google Chrome 6+, Mozilla Firefox 4+ y Opera 10+. Safari 5 y Google Chrome 6-8 no aceptarán la entrada de una dirección de correo electrónico no válida pero, a diferencia de otros navegadores, no ayudarán al usuario a corregir el error.
Ejemplo de validación de dirección de correo electrónico HTML5
Para activar los navegadores de los usuarios para validar las direcciones de correo electrónico con HTML5, use el siguiente código, por ejemplo:
