那些遇到过的问题

使用jQuery进行电子邮件验证

DuH*_*DuH 338 email validation jquery

我是jQuery的新手,想知道如何使用它来验证电子邮件地址.

Fab*_*ian 673

您可以使用常规的旧javascript:

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

  • 是的,请记住jQuery仍然是javascript :) (66认同)
  • 即使这个正则表达式认为大多数真实世界地址有效,它仍然有很多误报和漏报.例如,请参阅维基百科上的[有效和无效电子邮件地址的示例](http://en.wikipedia.org/wiki/Email_address#Valid_email_addresses). (36认同)
  • 随着新的顶级域名变得越来越普遍,这个正则表达式可能需要修改.systems和.poker等现在都是有效的顶级域名,但是未通过正则表达式检查 (10认同)
  • Per Theo对另一个答案的评论,你应该改变`var regex =/^([a-zA-Z0-9 _.+ - ])+\@(([a-zA-Z0-9 - ])+ \.) +([a-zA-Z0-9] {2,4})+ $ /;`到`var regex = /^([a-zA-Z0-9_.+-])+\@(([a -zA-Z0-9 - ])+ \.)+([a-zA-Z0-9] {2,6})+ $ /;`支持更新的TLD,如.museum等 (3认同)
  • 要了解适用于电子邮件地址的最新 regx，您可以查看 https://emailregex.com/ 。目前是 ```/^(([^<>()\[\]\\.,;:\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, }))$/``` (3认同)

Man*_*ava 159

jQuery函数验证电子邮件

我真的不喜欢使用插件,特别是当我的表单只有一个需要验证的字段时.我使用此功能并在需要验证电子邮件表单字段时调用它.

 function validateEmail($email) {
  var emailReg = /^([\w-\.]+@([\w-]+\.)+[\w-]{2,4})?$/;
  return emailReg.test( $email );
}
Run Code Online (Sandbox Code Playgroud)

现在要用它 

if( !validateEmail(emailaddress)) { /* do stuff here */ }
Run Code Online (Sandbox Code Playgroud)

干杯!

  • 你应该只返回`emailReg.test($ email);` (16认同)
  • 用于检查电子邮件地址有效性的正则表达式已经过时,因为我们现在有6个字符的域名扩展名,例如.museum,因此您需要更改`var emailReg = /^([\w-\.]+@([\w-] + \.)+ [\ w - ] {2,4})？$ /;`到`var emailReg =/^([\ w - \.] + @([\ w - ] + \.)+ [\W - ] {2,6-})$ /;` (14认同)
  • 仅供参考,对于空白电子邮件地址,此选项返回true.例如`emailReg.text("")``true`.我只是将函数归结为emailReg var的声明,然后是:`return($ email.length> 0 && emailReg.test($ email))` (7认同)
  • 对,你是@ h.coates!我来到这个线程希望发现jQuery实际上有一个内置的电子邮件验证.继续前进,这些不是您正在寻找的机器人...... (3认同)
  • @Theo的观点至关重要,但TLD的实际长度应大于6,扩展的理论上限为63个字符.目前最长的一个是20多个,请访问http://data.iana.org/TLD/tlds-alpha-by-domain.txt (3认同)

Nic*_*ver 40

我会使用jQuery验证插件有几个原因.

你验证了,好的,现在怎么样？您需要显示错误,在有效时处理擦除错误,显示总共有多少错误？它可以为您处理很多事情,无需重新发明轮子.

此外,另一个巨大的好处是它托管在CDN上,此答案时的当前版本可以在这里找到:http://www.asp.net/ajaxLibrary/CDNjQueryValidate16.ashx 这意味着客户端的加载时间更短.

  • 好的......不需要重新发明轮子.但为什么我必须安装几十KB的Javascript来验证字段.这就像建造一个汽车工厂,如果你需要的只是一个新车轮:) (6认同)
  • **感谢@NickCraver:**这实际上是处理电子邮件验证问题的"最佳实践"方法.这当然不像建立一个工厂(编写库来完成所有工作)来获得一个轮子.这就像按照工厂的指示将车轮安装在现代车辆上(将车顶起,放置车轮 - 放在螺母上),而不是试图找出如何在车上安装车轮.这个插件非常简单易用.要进行表单验证,它实际上是一个包含,一些注释和一个方法调用. (5认同)
  • @kraftb正如我的回答所述,它是围绕验证的处理和显示,而不仅仅是验证文本本身. (3认同)
  • 现在你正在重新发明'重新发明轮'的比喻! (3认同)

And*_*nik 37

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

$("#myform").validate({
  rules: {
    field: {
      required: true,
      email: true
    }
  }
});
Run Code Online (Sandbox Code Playgroud)

请参阅电子邮件方法文档以获取详细信

  • 但是接受的格式是`x @ x`(很奇怪)它必须`x @ xx`我该如何解决这个问题？ (6认同)
  • @BasheerAL-MOMANI [https://jqueryvalidation.org/jQuery.validator.methods/] `$.validator.methods.email = function( value, element ) { return this.optional( element ) || //^.+@.+\..+$/.test( value ); }` (2认同)

小智 15 

<script type="text/javascript">
    $(document).ready(function() {
      $('.form_error').hide();
      $('#submit').click(function(){
           var name = $('#name').val();
           var email = $('#email').val();
           var phone = $('#phone').val();
           var message = $('#message').val();
           if(name== ''){
              $('#name').next().show();
              return false;
            }
            if(email== ''){
               $('#email').next().show();
               return false;
            }
            if(IsEmail(email)==false){
                $('#invalid_email').show();
                return false;
            }

            if(phone== ''){
                $('#phone').next().show();
                return false;
            }
            if(message== ''){
                $('#message').next().show();
                return false;
            }
            //ajax call php page
            $.post("send.php", $("#contactform").serialize(),  function(response) {
            $('#contactform').fadeOut('slow',function(){
                $('#success').html(response);
                $('#success').fadeIn('slow');
               });
             });
             return false;
          });
      });
      function IsEmail(email) {
        var regex = /^([a-zA-Z0-9_\.\-\+])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/;
        if(!regex.test(email)) {
           return false;
        }else{
           return true;
        }
      }
  </script>

<form action="" method="post" id="contactform">
                            <table class="contact-table">
                              <tr>
                                <td><label for="name">Name :</label></td>
                                <td class="name"> <input name="name" id="name" type="text" placeholder="Please enter your name" class="contact-input"><span class="form_error">Please enter your name</span></td>
                              </tr>
                              <tr>
                                <td><label for="email">Email :</label></td>
                                <td class="email"><input name="email" id="email" type="text" placeholder="Please enter your email" class="contact-input"><span class="form_error">Please enter your email</span>
                                  <span class="form_error" id="invalid_email">This email is not valid</span></td>
                              </tr>
                              <tr>
                                <td><label for="phone">Phone :</label></td>
                                <td class="phone"><input name="phone" id="phone" type="text" placeholder="Please enter your phone" class="contact-input"><span class="form_error">Please enter your phone</span></td>
                              </tr>
                              <tr>
                                <td><label for="message">Message :</label></td>
                                <td class="message"><textarea name="message" id="message" class="contact-input"></textarea><span class="form_error">Please enter your message</span></td>
                              </tr>
                              <tr>
                                <td></td>
                                <td>
                                  <input type="submit" class="contactform-buttons" id="submit"value="Send" />
                                  <input type="reset" class="contactform-buttons" id="" value="Clear" />
                                </td>
                              </tr>
                            </table>
     </form>
     <div id="success" style="color:red;"></div>
Run Code Online (Sandbox Code Playgroud)

小智 15 

<!-- Dont forget to include the jQuery library here -->
<script type="text/javascript" src="jquery-1.3.2.min.js"></script>
<script type="text/javascript">

$(document).ready(function() {

    $("#validate").keyup(function(){

        var email = $("#validate").val();

        if(email != 0)
        {
            if(isValidEmailAddress(email))
            {
                $("#validEmail").css({
                    "background-image": "url('validYes.png')"
                });
            } else {
                $("#validEmail").css({
                    "background-image": "url('validNo.png')"
                });
            }
        } else {
            $("#validEmail").css({
                "background-image": "none"
            });         
        }

    });

});

function isValidEmailAddress(emailAddress) {
    var pattern = new RegExp(/^(("[\w-\s]+")|([\w-]+(?:\.[\w-]+)*)|("[\w-\s]+")([\w-]+(?:\.[\w-]+)*))(@((?:[\w-]+\.)*\w[\w-]{0,66})\.([a-z]{2,6}(?:\.[a-z]{2})?)$)|(@\[?((25[0-5]\.|2[0-4][0-9]\.|1[0-9]{2}\.|[0-9]{1,2}\.))((25[0-5]|2[0-4][0-9]|1[0-9]{2}|[0-9]{1,2})\.){2}(25[0-5]|2[0-4][0-9]|1[0-9]{2}|[0-9]{1,2})\]?$)/i);
    return pattern.test(emailAddress);
}

</script>

<style>
    #validEmail
    {
        margin-top: 4px;
        margin-left: 9px;
        position: absolute;
        width: 16px;
        height: 16px;
    }

    .text
    {
        font-family: Arial, Tahoma, Helvetica;
    }
</style>

    <title>Live Email Validation with jQuery Demo</title>
</head>
<body>
    <div class="text"><h1>Reynoldsftw.com - Live Email Validation</h1><h2>Type in an email address in the box below:</h2></div>
    <div><input type="text" id="validate" width="30"><span id="validEmail"></span></div>
    <div class="text"><P>More script and css style
Run Code Online (Sandbox Code Playgroud)

:www.htmldrive.net

来源:htmldrive.com

Rob*_*den 14

我推荐Verimail.js,它也有一个JQuery插件.

为什么？Verimail支持以下内容:

  • 语法验证(根据RFC 822)
  • IANA TLD验证
  • 针对最常见的TLD和电子邮件域的拼写建议
  • 拒绝临时电子邮件帐户域,例如mailinator.com

因此除了验证,Verimail.js还会为您提供建议.因此,如果您输入的电子邮件错误的TLD或域名与普通电子邮件域(hotmail.com,gmail.com等)非常相似,则可以检测到并建议更正.

例子:

  • test@gnail.con - >你的意思是测试@ gmail.com？
  • test@hey.nwt - >你的意思是测试@嘿.网？
  • test@hottmail.com - >你的意思是测试@ hotmail.com？

等等..

要将它与jQuery一起使用,只需在您的站点上包含verimail.jquery.js并运行以下函数:

$("input#email-address").verimail({
    messageElement: "p#status-message"
});
Run Code Online (Sandbox Code Playgroud)

message元素是一个显示消息的元素.这可以是从"您的电子邮件无效"到"您的意思是......？"的所有内容.

如果您有一个表单并且想要限制它以便除非电子邮件有效之外无法提交,那么您可以使用getVerimailStatus函数检查状态,如下所示:

if($("input#email-address").getVerimailStatus() < 0){
    // Invalid
}else{
    // Valid
}
Run Code Online (Sandbox Code Playgroud)

此函数根据Comfirm.AlphaMail.Verimail.Status对象返回整数状态代码.但一般的经验法则是,0以下的任何代码都是表示错误的代码.

小智 14 

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);
};
Run Code Online (Sandbox Code Playgroud) 

if( !isValidEmailAddress( emailaddress ) ) { /* do stuff here (email is invalid) */ }
Run Code Online (Sandbox Code Playgroud)

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

  • 如果您在 ASP.NET MVC Razor 页面中使用它，请不要忘记使用另一个“@”字符转义“@”字符。像这样`@@`，否则你会得到构建错误。 (2认同)

Gee*_*eek 10

这会执行更彻底的验证,例如它会检查用户名中的连续点,例如john..doe @ example.com 

function isValidEmail(email)
{
    return /^[a-z0-9]+([-._][a-z0-9]+)*@([a-z0-9]+(-[a-z0-9]+)*\.)+[a-z]{2,4}$/.test(email)
        && /^(?=.{1,64}@.{4,64}$)(?=.{6,100}$).*/.test(email);
}
Run Code Online (Sandbox Code Playgroud)

见在JavaScript中使用正则表达式验证电子邮件地址.

iam*_*7en 10

一个非常简单的解决方案是使用html5验证:

<form>
  <input type="email" required pattern="[^@]+@[^@]+\.[a-zA-Z]{2,6}">

  <input type="submit">
</form>
Run Code Online (Sandbox Code Playgroud)

http://jsfiddle.net/du676/56/

isa*_*ers 8

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

这适用于使用HTML5属性的浏览器,然后您甚至不需要JS.即使使用上面的一些脚本,使用电子邮件验证也不会做太多事情:

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

等...将全部验证为"真实"电子邮件.因此,最好确保用户必须输入两次电子邮件地址,以确保他们将相同的电子邮件地址放入其中.但是为了保证电子邮件地址是真实的,这将是非常困难的,但是看看是否有办法.但如果你只是确保它是一封电子邮件,请坚持使用HTML5输入.

FIDDLE示例

这适用于FireFox和Chrome.它可能无法在Internet Explorer中工作......但是Internet Explorer很糟糕.那么那就是......

Tre*_*man 8

MVC / ASP.NET中的Javascript电子邮件验证

我在使用Fabian答案时遇到的问题是，由于使用Razor @符号，因此在MVC视图中实现了该问题。您必须包括一个其他@符号才能对其进行转义，如下所示：@@

在MVC中避免剃刀

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

我在此页面上的其他地方都没有看到它，因此我认为这可能会有所帮助。

编辑

这是Microsoft 的链接，描述了它的用法。
我刚刚测试了上面的代码，并得到以下js：

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

到底是在做什么。

Jay*_*ari 7 

function isValidEmail(emailText) {
    var pattern = new RegExp(/^((([a-z]|\d|[!#\$%&'\*\+\-\/=\?\^_`{\|}~]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+(\.([a-z]|\d|[!#\$%&'\*\+\-\/=\?\^_`{\|}~]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+)*)|((\x22)((((\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?(([\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]))))*(((\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?(\x22)))@((([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(emailText);
};
Run Code Online (Sandbox Code Playgroud)

Use Like This :

if( !isValidEmail(myEmail) ) { /* do things if myEmail is valid. */ }
Run Code Online (Sandbox Code Playgroud)

JAB*_*JAB 6 

function validateEmail(emailaddress){  
   var emailReg = /^([\w-\.]+@([\w-]+\.)+[\w-]{2,4})?$/;  
   if(!emailReg.test(emailaddress)) {  
        alert("Please enter valid email id");
   }       
}
Run Code Online (Sandbox Code Playgroud)

Pri*_*tam 5 

<script type = "text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type = "text/javascript">
    function ValidateEmail(email) {
        var expr = /^([\w-\.]+)@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.)|(([\w-]+\.)+))([a-zA-Z]{2,4}|[0-9]{1,3})(\]?)$/;
        return expr.test(email);
    };
    $("#btnValidate").live("click", function () {
        if (!ValidateEmail($("#txtEmail").val())) {
            alert("Invalid email address.");
        }
        else {
            alert("Valid email address.");
        }
    });
</script>
<input type = "text" id = "txtEmail" />
<input type = "button" id = "btnValidate" value = "Validate" />
Run Code Online (Sandbox Code Playgroud)

tim*_*den 5

降落在这里.....最终在这里：https : //html.spec.whatwg.org/multipage/forms.html#valid-e-mail-address

...它提供了以下正则表达式：

/^[a-zA-Z0-9.!#$%&'*+\/=?^_`{|}~-]+@[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?(?:\.[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?)*$/
Run Code Online (Sandbox Code Playgroud)

...我发现这要归功于关于 jQuery 验证插件自述文件的说明：https : //github.com/jzaefferer/jquery-validation/blob/master/README.md#reporting-an-issue

因此，更新的版本@Fabian的回答将是：

function IsEmail(email) {
  var regex = /^[a-zA-Z0-9.!#$%&'*+\/=?^_`{|}~-]+@[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?(?:\.[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?)*$/;
  return regex.test(email);
}
Run Code Online (Sandbox Code Playgroud)

希望有帮助

Ste*_*hen 5

正如其他人提到的，您可以使用正则表达式来检查电子邮件地址是否与模式匹配。但是您仍然可以收到与模式匹配的电子邮件，但我仍会退回或成为伪造的垃圾邮件。

用正则表达式检查

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

使用真实的电子邮件验证API进行检查

您可以使用API​​来检查电子邮件地址是否真实且当前处于活动状态。

var emailAddress = "foo@bar.com"
response = $.get("https://isitarealemail.com/api/email/validate?email=" +
    emailAddress,
    function responseHandler(data) {
        if (data.status === 'valid') {
            // the email is valid and the mail box is active
        } else {
            // the email is incorrect or unable to be tested.
        }
    })
Run Code Online (Sandbox Code Playgroud)

有关更多信息，请参见https://isitarealemail.com或博客文章

归档时间：

查看次数：

778061 次

最近记录：

6 年，8 月 前
使用jQuery和regex验证电子邮件地址 173
更多相关链接
相关归档
正则表达式空字符串或电子邮件 117
将jquery选择器存储在变量中 33
jquery animate .css 25
使用'window','document'和'undefined'作为包装jQuery插件的匿名函数中的参数 24
更改Window.print()纸张方向 18
Rails:validates_length_of:allow_nil不允许nil 11
在Clojure中验证数字参数 8
在没有提交表格的情况下检查日期是否过去 5
只允许数字和字母输入字符串 3
如何在表单中的vtype验证的vtypes消息文本中包含字段值？ 0
难疑归档
如何从异步调用返回响应？ 5208
带请求正文的HTTP GET 1896
如何在macOS或OS X上安装pip？ 1676
在YAML中,如何在多行中断字符串？ 1388
如何在JavaScript中将十进制转换为十六进制？ 1387
什么是monad？ 1373
enctype ='multipart/form-data'是什么意思？ 1290
在关系数据库中存储分层数据有哪些选项？ 1281
如何将包含文件的文件夹复制到Unix/Linux中的另一个文件夹？ 1145
用于Python的IDE是什么？ 1028