validar validacion solo pattern numeros letras formularios formulario ejemplos con html5 email-validation

html5 - validacion - validar solo letras en html



¿Por qué la validación de formularios HTML5 permite correos electrónicos sin un punto? (8)

Estoy escribiendo una maqueta muy simple para demostrar algo de validación de formularios HTML5. Sin embargo, noté que la validación del correo electrónico no marca un punto en la dirección, ni tampoco los caracteres que siguen a dicho punto.

En otras palabras, "john @ doe" se considera válido, cuando claramente no es una dirección de correo electrónico válida; "doe" no es un dominio.

Así es como estoy codificando mi campo de correo electrónico:

<input type="email" required />

¿No es eso suficiente?

Mira este fiddle para ver a qué me refiero.

Nota: Sé cómo lograr esto a través de un patrón RegEx en su lugar. Me pregunto cómo alguien podría salirse con la suya usando el tipo de correo electrónico.


El RFC 822 , capítulo 6, proporciona la especificación de una dirección en formato Backus-Naur (BNF) aumentado:

addr-spec = local-part "@" domain local-part = word *("." word) domain = sub-domain *("." sub-domain)

Usando esta especificación a@b es una dirección válida.

ACTUALIZAR

Para responder el comentario de Trejkaz, agrego las siguientes definiciones. Vemos que el ESPACIO está permitido, pero solo en la secuencia citada.

word = atom / quoted-string atom = 1*<any CHAR except specials, SPACE and CTLs> quoted-string = <"> *(qtext/quoted-pair) <"> SPACE = <ASCII SP, space> CTL = <any ASCII control character and DEL> qtext = <any CHAR excepting <">, "/" & CR, and including linear-white-space> quoted-pair = "/" CHAR


En esta página de MDN muestra que los navegadores de expresiones regulares deberían usar para validar el correo electrónico:

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/email#Validation

Puede cambiar ligeramente esta expresión regular para requerir al menos un punto en el nombre de dominio: cambie la estrella * al final de la expresión regular a un signo más + . Luego usa esa expresión regular como el atributo de pattern :

<input type="email" pattern="^[a-zA-Z0-9.!#$%&''*+/=?^_`{|}~-]+@[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?(?:/.[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?)+$"></input>


En teoría, puede tener una dirección sin un "." en.

Desde el punto de vista técnico, cosas como:

user@com user@localserver user@[IPv6:2001:db8::1]

Son todos los correos electrónicos válidos.

Por lo tanto, la validación estándar de HTML5 permite todos los correos electrónicos válidos, incluidos los poco comunes.

Para algunas explicaciones fáciles de leer (en lugar de leer los estándares): http://en.wikipedia.org/wiki/Email_address#Examples


Este patrón siempre me funciona.

El texto debe estar en minúsculas pattern="[a-z0-9._%+-]+@[a-z0-9.-]+/.[az]{2,}$" pero creo que cubre más o menos la mayoría de los correos electrónicos.


Esto responde la pregunta.

/^(([^<>()/[/]//.,;:/s@"]+(/.[^<>()/[/]//.,;:/s@"]+)*)|(".+"))@((/[[0-9]{1,3}/.[0-9]{1,3}/.[0-9]{1,3}/.[0-9]{1,3}])|(([a-zA-Z/-0-9]+/.)+[a-zA-Z]{2,}))$/


Intenta agregar esto a la entrada

pattern="[a-z0-9._%+-]+@[a-z0-9.-]+/.[a-z]{2,63}$"

Fiddle


Porque a @ b es una dirección de correo electrónico válida (por ejemplo, localhost es un dominio válido). Ver http://en.wikipedia.org/wiki/Email_address#Examples

Además, tenga en cuenta que siempre debe hacer la validación de entrada en el servidor. La validación del lado del cliente debe ser solo para dar retroalimentación al usuario y no depender de ella, ya que se puede omitir fácilmente.


Puede personalizar el patrón del campo de correo electrónico:

input:valid { border-color: green } input:invalid { border-color: red }

Email: <input type="email" required value="[email protected]" /><br> Non-dots Email: <input type="email" required pattern="[^.]+@[^.]+" value="[email protected]" />