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


当前回答

如果你有一个基本的表单,只需输入电子邮件的类型: <input type="email" required>

这将适用于使用HTML5属性的浏览器,然后你甚至不需要JS。仅仅使用电子邮件验证,即使是上面的一些脚本也不会做太多,因为:

some.com so@em.co my@fakemail.net

等等……将全部验证为“真实”电子邮件。因此,最好确保用户必须输入两次电子邮件地址,以确保他们输入相同的电子邮件地址。但要保证电子邮件地址是真实的将是非常困难的,但如果有一种方法,将是非常有趣的。但如果你只是想确保它是一封电子邮件,那就坚持使用HTML5输入。

小提琴的例子

这适用于FireFox和Chrome。它可能在ie浏览器中不起作用…但是ie浏览器很烂。所以还有…

其他回答

http://so.devilmaycode.it/jquery-validate-e-mail-address-regex/ 使用新的正则表达式 增加了对地址标签(+号)的支持

function isValidEmailAddress(emailAddress) { var pattern = /^([a-z\d!#$%&'*+\-\/=?^_`{|}~\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF]+(\.[a-z\d!#$%&'*+\-\/=?^_`{|}~\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF]+)*|"((([ \t]*\r\n)?[ \t]+)?([\x01-\x08\x0b\x0c\x0e-\x1f\x7f\x21\x23-\x5b\x5d-\x7e\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF]|\\[\x01-\x09\x0b\x0c\x0d-\x7f\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF]))*(([ \t]*\r\n)?[ \t]+)?")@(([a-z\d\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF]|[a-z\d\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF][a-z\d\-._~\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF]*[a-z\d\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])\.)+([a-z\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF]|[a-z\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF][a-z\d\-._~\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF]*[a-z\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])\.?$/i; return pattern.test(emailAddress); };

if( !isValidEmailAddress( emailaddress ) ) { /* do stuff here (email is invalid) */ }

这是由用户Luca Filosofi提供的答案

你可以使用常规的旧javascript:

function isEmail(email) {
  var regex = /^([a-zA-Z0-9_.+-])+\@(([a-zA-Z0-9-])+\.)+([a-zA-Z0-9]{2,4})+$/;
  return regex.test(email);
}

在输入时验证电子邮件,带有按钮状态处理。

$("#email").on("input", function(){
    var email = $("#email").val();
    var filter = /^([\w-\.]+)@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.)|(([\w-]+\.)+))([a-zA-Z]{2,4}|[0-9]{1,3})(\]?)$/;
    if (!filter.test(email)) {
      $(".invalid-email:empty").append("Invalid Email Address");
      $("#submit").attr("disabled", true);
    } else {
      $("#submit").attr("disabled", false);
      $(".invalid-email").empty();
    }
  });

查看http: //bassistance.de/jquery-plugins/jquery-plugin-validation/。这是一个很好的jQuery插件,它允许为表单构建强大的验证系统。 这里有一些有用的示例。因此,表单中的电子邮件字段验证看起来是这样的:

$("#myform").validate({
  rules: {
    field: {
      required: true,
      email: true
    }
  }
});

有关详细信息和示例,请参阅电子邮件方法文档。

你应该看到:jquery.validate.js,把它添加到你的项目

这样使用它:

<input id='email' name='email' class='required email'/>