首页 >web前端 >js教程 >如何使用 JavaScript 验证电子邮件地址?

如何使用 JavaScript 验证电子邮件地址?

Linda Hamilton
Linda Hamilton原创
2024-12-29 05:40:10273浏览

How Can I Validate Email Addresses Using JavaScript?

在 JavaScript 中验证电子邮件地址

为了确保用户输入的是有效的电子邮件地址,JavaScript 提供了多种验证技术。

正则表达式:

利用正则表达式是一种有效的电子邮件验证方法。请考虑以下与有效电子邮件格式匹配的表达式:

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 支持:

要在电子邮件地址中容纳 unicode 字符,请使用以下正则表达式:

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

客户端验证:

此 JavaScript 代码演示了如何在客户端验证电子邮件地址:

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

function validate() {
  const email = $('#email').val();
  const $result = $('#result');
  $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;
}

注意事项:

请记住仅 JavaScript 验证是不够的,因为用户可以禁用它。在服务器端实施验证以确保数据完整性也至关重要。

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

声明:
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn