查找 HTML5 表单用于验证的正则表达式

Posted

技术标签:

【中文标题】查找 HTML5 表单用于验证的正则表达式【英文标题】:Find the regex used by HTML5 forms for validation 【发布时间】:2011-12-08 19:41:44 【问题描述】:

一些 html5 输入元素接受 pattern 属性,这是一个用于表单验证的正则表达式。其他一些 HTML5 输入元素,例如 input type=email 会自动进行验证。

现在看来,不同浏览器处理验证的方式是不同的。给定一个特定的浏览器,比如 Chrome,是否可以以编程方式提取用于验证的正则表达式?或者那里有文档?

【问题讨论】:

@jfriend00 看看这里:regular-expressions.info/email.html @jfriend00:这取决于您对“有效电子邮件地址”的概念是什么。如 [this answer][***.com/questions/201323/… 中所示,RFC822 可以被正则表达式覆盖,尽管 RFC5322 不能。 HTML5 指定了一个更狭窄的“有效电子邮件地址”概念,可以使用正则表达式进行验证(请参阅我的回答)。 【参考方案1】:

HTML5 spec 当前列出了一个与 ABNF 匹配的有效电子邮件地址:

1*( atext / "." ) "@" ldh-str *( "." ldh-str )

在this question 中阐明。 @SLaks answer 提供了一个等效的正则表达式。

也就是说,稍微挖掘一下源代码,就会发现WebKit implemented 电子邮件地址验证使用与SLaks answer 基本相同的正则表达式,即,

[a-z0-9!#$%&'*+/=?^_`|~.-]+@[a-z0-9-]+(\.[a-z0-9-]+)*

但是,电子邮件地址不需要通过正则表达式进行验证。例如,Mozilla (Gecko) 使用非常基本的finite state machine 实现了电子邮件验证。因此,电子邮件验证不需要涉及正则表达式。

【讨论】:

[a-z0-9!#$%&'+/=?^_`|~.-]+@[a-z0-9-]+(\ .[a-z0-9-]+) 匹配 FF9 linux 中的 word_word.word@word @jpse:如果您阅读上面链接的规范,您会注意到它故意违反 RFC 5322,或者换句话说,用于验证HTML 电子邮件字段无法匹配某些有效的电子邮件地址并匹配一些无效的电子邮件地址。【参考方案2】:

HTML5 规范现在提供了一个(非规范)正则表达式,它应该与它指定为有效的所有电子邮件地址完全匹配。在我的博客上有一个副本: http://blog.gerv.net/2011/05/html5_email_address_regexp/ 并在规范本身: https://html.spec.whatwg.org/#e-mail-state-(type=email))

上面的版本是不正确的,只是它没有将域组件限制为最多 255 个字符,也没有阻止它们以“-”开头或结尾。

热度

【讨论】:

您能否链接正则表达式而不是链接到您的博客,这可能最终无法解决一天? HTML5 规范是获取永久链接的最佳位置:html.spec.whatwg.org/#e-mail-state-(type=email)。【参考方案3】:

这对我有用: 模式="[^@]+@[^@]+.[a-zA-Z]2,6"

【讨论】:

以上是关于查找 HTML5 表单用于验证的正则表达式的主要内容,如果未能解决你的问题,请参考以下文章

表单验证—正则表达式

表单校验

表单校验及正则表达式

JavaScript表单验证和正则表达式

基础知识

7.4 Javascript:表单验证-揭开正则表达式的面纱