HTML5 Email Modèle d'Entrée de l'Attribut
Je suis en train de faire un html5 formulaire qui contient un e-mail entrée, une case à cocher d'entrée, et un soumettre des commentaires.
Je suis en train d'utiliser le modèle de l'attribut de l'e-mail d'entrée mais je ne sais pas ce qui la place dans cet attribut. Je sais que je suis censé utiliser une expression régulière qui doit correspondre au JavaScript Modèle de production, mais je ne sais pas comment faire.
Ce que je vais essayer d'obtenir cet attribut à faire est de vérifier que l'e-mail contient un @ et au moins un ou plusieurs point et, si possible, vérifier pour voir si l'adresse après le @ est une adresse réelle. Si je ne peux pas le faire par le biais de cet attribut, puis je vais envisager d'utiliser JavaScript, mais pour la vérification de l'un @ et un ou plusieurs point que je tiens à utiliser le modèle de l'attribut pour vous.
le modèle de l'attribut doit vérier:
- un seul @
- un ou plusieurs point
- et, si possible, vérifier pour voir si l'adresse après le @ est une adresse valide
Une alternative à cela est d'utiliser un code JavaScript, mais pour toutes les autres conditions, je ne veux pas utiliser un JavaScript
- Pourquoi ne pas simplement utiliser une adresse email du type d'entrée?
- Le HTML5 saisie de courrier électronique traite
foo@bar
comme valide. Bien qu'il soit techniquement valides (par exemple,foo@localhost
est une adresse email valide), pour la plupart du monde réel de cas d'utilisation, il ne va pas au travail, et les utilisateurs peuvent finir par ne pas obtenir l'e-mail comme ils ont raté le .com (ou autre) hors - Voir cette réponse une autre solution, qui comprend également des modèles pour d'autres types d'entrées.
- Spec: HTML 5.2 spec section 4.10.5.3.6. Le modèle de l'attribut
Vous devez vous connecter pour publier un commentaire.
C'est un double problème (comme beaucoup de gens dans le world wide web monde).
Vous avez besoin d'évaluer si le navigateur prend en charge le html5 (j'utilise Modernizr pour le faire). Dans ce cas, si vous avez une forme normale, le navigateur va faire le travail pour vous, mais si vous avez besoin d'ajax/json (comme beaucoup de tous les jours des cas) vous devez exécuter une vérification manuelle de toute façon.
.. donc, ma suggestion est d'utiliser une expression régulière pour évaluer à tout moment avant de soumettre. L'expression que j'utilise est le suivant:
Ce qui est prise de http://www.regular-expressions.info/ . C'est un monde dur à comprendre et à maîtriser, donc je vous suggère de lire attentivement cette page.
J'ai eu exactement ce problème avec HTML5s de saisie de courrier électronique, à l'aide de Alwin Keslers réponse ci-dessus, j'ai ajouté l'expression régulière de l'HTML5 saisie de courrier électronique afin que l'utilisateur doit avoir .quelque chose à la fin.
type="email"
et le motif dans la dernière version de Firefox (44,45) a échoué. J'ai eu à utilisertype="text"
pour le motif travail.type="email"
la base du travail déjà dans les navigateurs modernes. Donc, en utilisantpattern
attribut juste annule le comportement par défaut.En HTML5, vous pouvez utiliser le nouveau "e-mail" type: http://www.w3.org/TR/html-markup/input.email.html
Par exemple:
Si le navigateur implémente HTML5 il sera assurez-vous que l'utilisateur a entré une adresse email valide dans le champ. Notez que si le navigateur ne prend pas en œuvre HTML5, il sera traité comme un "texte" type, c'est à dire:
s@s
absolument adresse de courriel valide. En outre, même" "@s
est une adresse email valide.Malheureusement, toutes les suggestions à l'exception de B-l'Argent ne sont pas valides pour la plupart des cas.
Ici est beaucoup de e-mails valides comme:
En raison de la complexité pour obtenir la validation de droit, je propose un très solution générique:
Il vérifie si l'email contient au moins un caractère (numéro ou que ce soit l'exception d'une autre "@" ou espace) avant le "@", au moins deux caractères (ou quel que soit l'exception d'une autre "@" ou espace) après le "@" et un point entre les deux. Ce modèle n'accepte pas les adresses comme lol@entreprise, parfois utilisé dans les réseaux internes. Mais celui-ci pourrait être utilisé, si nécessaire:
Des deux modèles accepte également moins d'e-mails valides, par exemple des e-mails avec tabulation verticale. Mais pour moi, c'est assez bon. De meilleurs freins comme essayer de se connecter au serveur de messagerie électronique ou de ping-domaine doit arriver de toute façon sur le côté serveur.
BTW, j'ai juste écrit angulaire de la directive (pas encore testé) pour l'email de validation avec
novalidate
et sans basée sur le modèle ci-dessus à l'appui de SÈCHE-principe:Utilisation:
Pour B-l'Argent du motif est "@" juste assez. Mais il baisse de deux ou plusieurs"@", et tous les espaces.
C'est l'approche que j'utilise et vous pouvez les modifier en fonction de vos besoins:
Explication:
Nous voulons nous assurer que l'adresse e-mail à l'adresse commence toujours par un mot:
^[\w]
Un mot est tout de caractères, de chiffres ou le caractère de soulignement. Vous pouvez utiliser [a-zA-Z0-9_] patron, mais il vous donnera le même résultat et c'est plus long.
Prochaine, nous voulons nous assurer qu'il y a au moins un de ces caractères:
^[\w]{1,}
Prochaine, nous voulons permettre à tous de mots, de chiffres ou de caractères spéciaux dans le nom. De cette façon, on peut être sûr que l'adresse e-mail ne démarre pas avec la dot, mais elle peut contenir le point sur les autres que la première position:
^[\w]{1,}[\w.+-]
Et bien sûr, il n'a pas à être un de ces personnage, car l'e-mail peut avoir qu'une lettre suivie par @:
^[\w]{1,}[\w.+-]{0,}
Ensuite, nous devons le caractère@, qui est obligatoire, mais il peut être un seul dans l'ensemble de l'e-mail:
^[\w]{1,}[\w.+-]{0,}@
Juste derrière le caractère@, nous voulons que le nom de domaine. Ici, vous pouvez définir le nombre de caractères que vous souhaitez minimum et à partir de laquelle la gamme de caractères. J'irais pour tous les caractères, y compris le trait d'union [\w-] et je veux au moins deux d'entre eux {2,}. Si vous souhaitez permettre à des domaines tels que la t.co, vous devez permettre à un personnage de cette gamme {1,}:
^[\w]{1,}[\w.+-]{0,}@[\w-]{2,}
Ensuite, nous devons faire face à deux cas. Il n'y a juste le nom de domaine suivi par l'extension de domaine ou sous-domaine nom suivi du nom de domaine suivi de l'extension, par exemple, abc.com contre abc.co.royaume-uni. Pour ce faire, nous devons utiliser la (a|b) jeton où un représente le premier cas, b représente le deuxième cas et | est synonyme de logique OU. Dans le premier cas, nous allons utiliser l'extension de domaine, mais depuis, elle sera toujours là, peu importe le cas, nous pouvons ajouter les deux cas:
^[\w]{1,}[\w.+-]{0,}@[\w-]{2,}([.][a-zA-Z]{2,}|[.][a-zA-Z]{2,})
Ce modèle est dit que nous avons besoin d'exactement un caractère de point suivi de lettres, pas de chiffres, et nous voulons au moins deux d'entre eux, dans les deux cas.
Pour le deuxième cas, nous allons ajouter le nom de domaine en face de l'extension de domaine, donc de rendre le nom de domaine d'origine un sous-domaine:
^[\w]{1,}[\w.+-]{0,}@[\w-]{2,}([.][a-zA-Z]{2,}|[.][\w-]{2,}[.][a-zA-Z]{2,})
Le nom de domaine peut être composé de caractères de mot, y compris le trait d'union et de nouveau, nous voulons au moins deux caractères.
Enfin, nous avons besoin de marquer la fin de l'ensemble du motif:
^[\w]{1,}[\w.+-]{0,}@[\w-]{2,}([.][a-zA-Z]{2,}|[.][\w-]{2,}[.][a-zA-Z]{2,})$
Aller ici et de tester si votre adresse e-mail correspond au modèle: https://regex101.com/r/374XLJ/1
Ceci est une version modifiée de la solution ci-dessus, qui acceptent la lettre capitale ainsi.
J'ai utilisé à la suite d'Regex à satisfaire pour les e-mails suivants.
Code
"[A-Za-z0-9._%+-]{2,}@[a-zA-Z]{1,}([.]{1}[a-zA-Z]{2,}|[.]{1}[a-zA-Z]{2,}[.]{1}[a-zA-Z]{2,})"
, Cela devrait fonctionner pour vousdocumentation http://www.w3.org/TR/html-markup/input.email.html
Vous voulez probablement quelque chose comme ça. Avis attributs:
<input type="email" value="" name="EMAIL" id="EMAIL" placeholder="[email protected]" autofocus required pattern="[^ @]*@[^ @]*" />
La solution qui est construit au-dessus de w3org spécification.
Original regex est pris de w3org.
Le dernier "* Paresseux quantificateur" dans cette expression a été remplacée par "+ Un ou plusieurs quantificateur".
Un tel modèle est entièrement conforme à la spécification, à une exception près: il ne permet pas de domaine de premier niveau, tels que les adresses "foo@com"
Mis À Jour 2018 Réponse
Aller ici http://emailregex.com/
Javascript:
/^(([^<>()\[\]\\.,;:\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,}))$/
J'ai testé la regex suivante qui donne le même résultat que le Chrome Html e-mail de validation de la saisie.
Vous pouvez le tester sur ce site:
regex101