HTML5电子邮件验证
据说“使用HTML5,我们不需要更多js或服务器端代码来检查用户的输入是否是有效的电子邮件地址或url地址”
如何在用户输入后验证电子邮件? 如果用户输入他/她的电子邮件地址的错误形式,没有JS如何显示消息。
<input type="email" pattern="[^ @]*@[^ @]*" placeholder="Enter your email">
<input type="submit" value="Submit">
在HTML5中,你可以这样做:
<form>
<input type="email" placeholder="Enter your email">
<input type="submit" value="Submit">
</form>
当用户按下提交时,它会自动显示如下错误消息:
input type=email
www.w3.org网站的input type=email
页面指出,电子邮件地址是任何与以下正则表达式匹配的字符串:
/^[a-zA-Z0-9.!#$%&’*+/=?^_`{|}~-]+@[a-zA-Z0-9-]+(?:.[a-zA-Z0-9-]+)*$/
使用required
属性和pattern
属性来要求值匹配正则表达式模式。
<input
type="text"
pattern="/^[a-zA-Z0-9.!#$%&’*+/=?^_`{|}~-]+@[a-zA-Z0-9-]+(?:.[a-zA-Z0-9-]+)*$/"
required
>
使用[a-zA-Z0-9.-_]{1,}@[a-zA-Z.-]{2,}[.]{1}[a-zA-Z]{2,}
为somemail@email.com
/ somemail@email.com.vn