JavaScript邮箱正则表达式验证详解与代码示例
本文详细解析JavaScript中用于验证邮箱地址的正则表达式。通过多个代码示例,展示了从基础匹配到包含特殊字符(如连字符、下划线)的复杂规则。文章提供了具体的JS函数实现及HTML交互代码,帮助用户理解如何在前端有效校验邮箱格式,包括对域名后缀长度及前缀字符的限制。
基础邮箱正则表达式解析
相关代码实现如下:
/^([a-zA-Z0-9_-])+@([a-zA-Z0-9_-])+(.[a-zA-Z0-9_-])+/ 该表达式的逻辑是:字符串开头需包含一个或多个字母、数字、下划线或连字符,随后紧跟@符号,接着又是一个或多个字母、数字、下划线或连字符。之后是点号“.”与字母、数字及连字符的组合,且该组合可以出现一次或多次。
具体JavaScript实现代码如下:
<script type="text/javascript">
function isEmail(str){
var reg = /^([a-zA-Z0-9_-])+@([a-zA-Z0-9_-])+(.[a-zA-Z0-9_-])+/;
return reg.test(str);
}
var str = 'test@hotmail.com';
document.write(isEmail(str)+'<br />');
var str2 = 'test@sima.vip.com';
document.write(isEmail(str2)+'<br />');
var str3 = 'te-st@qq.com.cn';
document.write(isEmail(str3)+'<br />');
var str4 = 'te_st@sima.vip.com';
document.write(isEmail(str4)+'<br />');
var str5 = 'te.._st@sima.vip.com';
document.write(isEmail(str5)+'<br />');
</script> 邮箱前缀类型统计
由于对邮箱的具体规范了解有限,上述正则表达式相对简单。
统计一下邮箱@前缀的几种类型
1、纯数字
例如:123456@jb51.net
2、纯字母
3、字母与数字混合
4、包含点号
例如:web.blue@jb51.net
5、包含下划线
例如:web_blue@jb51.net
6、包含连字符
例如:web-blue@jb51.net
邮箱域名部分至少包含一个“.”和两个单词。若要求更严格,顶级域名至少需2个字母;以域名“name”为例,最大长度为4,若放宽限制可设为5。
当然,以下情况被视为无效:以“_”或“-”开头或结尾,或包含其他特殊符号。
改进版正则表达式与交互实现
因此,改进后的正则表达式如下:
^[A-Za-zd]+([-_.][A-Za-zd]+)*@([A-Za-zd]+[-.])+[A-Za-zd]{2,5}$
完整交互代码示例如下:
<script type="text/javascript">
fChkMail=function(szMail){
var szReg=/^[A-Za-zd]+([-_.][A-Za-zd]+)*@([A-Za-zd]+[-.])+[A-Za-zd]{2,5}$/;
var bChk=szReg.test(szMail);
return bChk;
}
</script>
<input type="text" id="Mail" value="" />
<input type="button" value="验证邮箱地址" onclick="alert(fChkMail(document.getElementById('Mail').value));" />
<p>邮箱不能以 - _ .以及其它特殊字符开头和结束</p>
<p>邮箱域名结尾为2~5个字母,比如cn、com、name</p>JS动态构建复杂嵌套JSON对象的方法
2026-11-05 15:41:52
JS负数取余为什么是负数?详解余数与模运算区别
2026-11-05 13:34:41
JS 解压出现乱码或报错怎么解决?
2026-11-05 12:32:38
JS 中 startsWith、indexOf 与正则判断字符串前缀的对比
2026-11-04 22:19:43
JS解析Excel后怎么将数据转换为JSON格式
2026-11-04 20:58:28
