如何在JavaScript中验证电子邮件地址

更新日期: 2021-10-13阅读: 2.5k标签: 验证

如何使用js验证email的验证的正确性?这篇文章做一个简单的总结。


方式一:简单验证

对于想要以以下形式进行真正简单验证的人

fly63@email.com

正则表达式:

/\S+@\S+\.\S+/

要防止匹配多个@ 符号(推荐使用):

/^[^\s@]+@[^\s@]+\.[^\s@]+$/

JavaScript 函数示例:

function validateEmail(email) {
var re = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
return re.test(email);
}
console.log(validateEmail(fly63@email.com'));

这样能保证用户输入的邮箱没有明显的错误,绝大部分是正确的,而且效率是最高的。


方式二、官网标准

官方标准称为RFC 2822。它描述了有效电子邮件地址必须遵守的语法。使用这个正则表达式来实现它:

(?:[a-z0-9!#$%&'*+/=?^_`{|}~-]+(?:\.[a-z0-9!#$%&'*+/=?^_`{|}~-]+)*|"(?:[\x01-\x08\x0b\x0c\x0e-\x1f\x21\x23-\x5b\x5d-\x7f]|\\[\x01-\x09\x0b\x0c\x0e-\x7f])*")@(?:(?:[a-z0-9](?:[a-z0-9-]*[a-z0-9])?\.)+[a-z0-9](?:[a-z0-9-]*[a-z0-9])?|\[(?:(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.){3}(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?|[a-z0-9-]*[a-z0-9]:(?:[\x01-\x08\x0b\x0c\x0e-\x1f\x21-\x5a\x53-\x7f]|\\[\x01-\x09\x0b\x0c\x0e-\x7f])+)\])

如果我们省略使用双引号和方括号的语法,我们将获得更实用的 RFC 2822 实现。它仍然会匹配今天实际使用的所有电子邮件地址的 99.99%。

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


方式三、html5表单验证

HTML5 本身具有电子邮件验证功能。如果您的浏览器支持 HTML5,那么您可以使用以下代码

<form>
<input type="email" placeholder="me@example.com" required>
<input type="submit">
</form>

只需检查输入的电子邮件地址是否有效或不使用 HTML,无需编写用于验证的函数。需要注意的是:存在浏览器兼容性。


链接: https://fly63.com/article/detial/10726

Validate表单验证插件之常用参数介绍

Validate常用的一些参数和方法:errorElement,errorClass,errorPlacement,errorLabelContainer,errorContainer,wrapper,success,debug

html实现邮箱发送邮件_js发送邮件至指定邮箱功能

在前端开发中,JavaScript并没有提供直接操作Email邮箱的功能方法,但是遇到这样的需求,我们应该如何实现js发送邮件至指定邮箱功能呢?

vue短信验证性能优化写入localstorage中

当点击完按钮时,倒计时还没到60s过完时,刷新浏览器,验证码按钮又可以重新点击;就需要把时间都写到localstorage里面去,当打开页面的时候,就去localstorage里面去取,我这里就贴上我的解决方法,因为前几天有个vue的项目用到该方法

登陆时短信验证码的原理,实现

陆时需要发送短信验证码或者其他的验证方式来校验是否是本人操作,达到安全性的目的。点击获取验证码时,倒计时,暂时设定倒计时的时间为180秒....

网页如何实现拼图滑块的验证码_纯js的实现

滑动解锁应该是有两张图片,一张正常的,一张上面有解锁区域的(后端给),然后前端只用把用户释放鼠标后,滑动模块在图片上的xy轴传给后端,后端做成功与否的判断。如果只是纯前端js验证,不具备高安全性。

风火云短信验证码接收平台, 接码快速,平台稳定,简单易学

目前的社会发展得非常快,互联网产业的发展更是让很多人惊奇,平台越来越多也导致了搭载程序的要求必须高,服务平台完善性还体现于短信验证码是否具备,只有在具备的前提下才能有着更大的保证

验证码的分类_ 网页验证码有哪些方式?

早期的互联网是没有验证码的,随着后来计算机程序的发展,黑客编写了模仿登录、恶意破解密码、刷票、论坛灌水等恶意程序,破坏了整个网络的平衡性。介绍目前常用验证码的分类有哪些:Gif动画验证码、手机短信验证码、手机语音验证码、视频验证码、滑动验证码

滑动验证码原理实现

滑动验证码在很多网站逐步流行起来,一方面对用户体验来说,比较新颖,操作简单,另一方面相对图形验证码来说,安全性并没有很大的降低。常见验证码是需要输入图中字符的,是因为机器识别字符比较困难,以此来防止机器自动的行为。

基于react的滑动图片验证码组件

业务需求,需要在系统登陆的时候,使用“滑动图片验证码”,来验证操作的不是机器人。在一般的页面组件引用即可。onReload这个函数一般是用来请求后台图片的。

Vue中的验证登录状态

Vue项目中实现用户登录及token验证,先说一下我的实现步骤:使用easy-mock新建登录接口,模拟用户数据;使用axios请求登录接口,匹配账号和密码,账号密码验证后, 拿到token,将token存储到sessionStorage中,并跳转到首页

点击更多...

内容以共享、参考、研究为目的,不存在任何商业目的。其版权属原作者所有,如有侵权或违规,请与小编联系!情况属实本人将予以删除!