JS正则验证邮箱的格式详细介绍

JS正则验证邮箱的格式，是指使用正则表达式对输入的邮箱地址进行格式的验证，判断其是否符合规范。邮箱地址的规范包括用户名部分、邮件服务器域名部分和顶级域名部分三大部分。下面我们进行详细介绍：

正则表达式格式

验证邮箱格式的正则表达式格式：/^[\w-]+(\.[\w-]+)*@([\w-]+\.)+[a-zA-Z]{2,}$/

正则表达式详细解释

• ^ 开头，表示匹配输入字符串的开头
• [\w-]+(\.[\w-]+)* 表示用户名部分，由字母、数字、下划线或短横线组成，可以包含一个或多个点，但点不能连续出现两次以上
• @ 表示@符号，是界定用户名和域名的分界线
• ([\w-]+\.)+ 表示邮件服务器域名部分，由一个或多个字母、数字、下划线或短横线组成，可以包含一个点
• [a-zA-Z]{2,} 表示顶级域名部分，用于表示域名的后缀，由两个或多个字母组成，如 .com、.cn、.org 等

示例说明

下面给出两个示例说明：

示例一

当输入的邮箱地址符合格式要求时，返回 true；否则返回 false。

function isValidEmail(email) {
  var reg = /^[\w-]+(\.[\w-]+)*@([\w-]+\.)+[a-zA-Z]{2,}$/;
  return reg.test(email);
}

isValidEmail('[e-mail]'); // true
isValidEmail('[e-mail]'); // true
isValidEmail('user'); // false
isValidEmail('user@.com'); // false

示例二

当输入的邮箱地址不符合格式要求时，提示“邮箱格式不合法”。

<form>
  <p>请输入您的邮箱地址：</p>
  <input type="text" id="email">
  <button onclick="checkEmail()">提交</button>
</form>

<script>
function checkEmail() {
  var email = document.getElementById('email').value;
  var reg = /^[\w-]+(\.[\w-]+)*@([\w-]+\.)+[a-zA-Z]{2,}$/;
  if (reg.test(email)) {
    alert('邮箱格式正确');
  } else {
    alert('邮箱格式不合法');
  }
}
</script>

在以上示例中，我们在页面上添加了一个表单和一个按钮。当用户输入的邮箱地址符合格式要求时，点击按钮将弹出“邮箱格式正确”提示；否则将弹出“邮箱格式不合法”提示。