Question

我正在编写一个非常简单的模型来演示一些HTML5表单验证。但是，我注意到电子邮件验证没有检查地址中的点，也没有检查点后面的字符。

换句话说，“john @ doe”被认为是有效的，当它显然不是有效的电子邮件地址时; “doe”不是域名。

这就是我编写电子邮件字段的方式：

<input type="email" required />

这还不够吗？

选中此fiddle以了解我的意思。

注意：我知道如何通过RegEx模式来实现此目的。我只是想知道某人如何能够使用电子邮件类型。

Answer 1

理论上你可以有一个没有“。”的地址。 in。

从技术上讲，如：

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

是否所有有效的电子邮件。

因此标准HTML5验证允许所有有效的电子邮件，包括不常见的电子邮件。

对于一些易于阅读的解释（而不是阅读标准）： http://en.wikipedia.org/wiki/Email_address#Examples

Answer 2

因为@ b是有效的电子邮件地址（例如localhost是有效的域）。见http://en.wikipedia.org/wiki/Email_address#Examples

另外，请记住，您应该始终在服务器中进行输入验证。客户端验证应仅用于向用户提供反馈而不是依赖，因为它可以很容易地被绕过。

Answer 3

尝试将此添加到输入

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

Fiddle

Answer 4

RFC 822，第6章，给出了增强Backus-Naur形式（BNF）中地址的规范：

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

使用此规范a@b是有效的地址。

<强>更新

要回答Trejkaz的评论，我添加以下定义。我们看到允许使用SPACE，但只能使用带引号的字符串。

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

Answer 5

您可以自定义电子邮件字段的模式：

＆＃13;

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

＆＃13;

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

＆＃13;

Answer 6

在此MDN页面上，它显示了正则表达式浏览器应使用该电子邮件来验证电子邮件：

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

您可以稍微更改此正则表达式以在域名中至少需要一个点：将正则表达式末尾的星号*更改为加号+。然后使用该正则表达式作为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>

Answer 7

这是使用正则表达式模式使用html5的方法。您还可以添加要显示的自定义消息。

<form>
  <input type="email" value="paul@test" required pattern="[a-z0-9._%+-]+@[a-z0-9.-]+\.[a-z]{2,63}$" title="Hey, you are missing domain part in the email !!!"/>
  <button type="submit">Click Me</button>
</form>

Answer 8

这种模式总是对我有用。

文字必须是小写的pattern="[a-z0-9._%+-]+@[a-z0-9.-]+\.[a-z]{2,}$"，但我认为它涵盖了或多或少的大部分电子邮件。

Answer 9

这回答了这个问题。

/^(([^<>()\[\]\\.,;:\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,}))$/

为什么HTML5表单验证允许没有点的电子邮件？

9 个答案: