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

当前回答

<!-- 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

: www.htmldrive.net

来源:htmldrive.com

2013-09-03 18:56:08

其他回答

如果你正在使用jquery验证

我创建了一个方法emailCustomFormat，使用正则表达式为我的自定义格式，你可以改变它来满足你的要求

jQuery.validator.addMethod("emailCustomFormat", function (value, element) {
        return this.optional(element) || /^([\w-\.]+@([\w-]+\.)+[\w-]{2,4})?$/.test(value);
    }, abp.localization.localize("Please_enter_valid_email_message"));// localized message based on current language

然后你可以这样使用它

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

这个正则表达式接受

abc@abc.abc, abc@abc.abcd 但不是这个

abc@abc ， abc@abc.a， abc@abc.abcde

希望这对你有所帮助

2016-11-30 10:05:21

使用jquery.validate.js，它有微软ajax CDN。

$('#form').validate({
    rules:{
        "name":{
            required:true,
            maxlength:40
        },

        "email":{
            required:true,
            email:true, //for validate email
            maxlength:100
        },

        "message":{
            required:true
        }
    }
});

2016-08-04 05:50:46

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

这样使用它:

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

2015-03-24 01:39:08

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

2011-11-04 06:01:36

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

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

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

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

小提琴的例子

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

2014-03-04 04:09:45

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

推荐文章

最新文章

标签