如何使用 JavaScript 正则表达式验证电子邮件地址？

在 JavaScript 中使用正则表达式进行电子邮件验证

为了防止错误的用户输入，JavaScript 允许在尝试发送电子邮件地址之前对其进行验证到服务器或尝试向他们发送电子邮件。

在 JavaScript 中验证电子邮件地址的最可靠方法就是使用正则表达式。以下正则表达式接受 ASCII 字符：

const validateEmail = (email) => {
  return String(email)
    .toLowerCase()
    .match(
      /^(([^<>()[\]\.,;:\s@"]+(\.[^<>()[\]\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/
    );
};

对于 unicode 支持，可以使用更全面的正则表达式：

const re =
  /^(([^<>()[\]\.,;:\s@"]+(\.[^<>()[\]\.,;:\s@"]+)*)|(".+"))@(([^<>()[\]\.,;:\s@"]+\.)+[^<>()[\]\.,;:\s@"]{2,})$/i;

但是，重要的是要记住 JavaScript 验证不应该只能依靠。客户端验证很容易被绕过。服务器端验证也是必要的。

下面是客户端 JavaScript 电子邮件验证的示例：

const validateEmail = (email) => {
  return email.match(
    /^(([^<>()[\]\.,;:\s@\"]+(\.[^<>()[\]\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/
  );
};

const validate = () => {
  const $result = $('#result');
  const email = $('#email').val();
  $result.text('');

  if(validateEmail(email)){
    $result.text(email + ' is valid.');
    $result.css('color', 'green');
  } else{
    $result.text(email + ' is invalid.');
    $result.css('color', 'red');
  }
  return false;
}

$('#email').on('input', validate);

在此示例中，使用按钮来触发验证并显示结果。

以上是如何使用 JavaScript 正则表达式验证电子邮件地址？的详细内容。更多信息请关注PHP中文网其他相关文章！