Validando endereços de email usando jQuery e regex

174

Não tenho muita certeza de como fazer isso. Preciso validar endereços de email usando regex com algo como isto:

[a-z0-9!#$%&'*+/=?^_`{|}~-]+(?:\.[a-z0-9!#$%&'*+/=?^_`{|}~-]+)*@(?:[a-z0-9](?:[a-z0-9-]*[a-z0-9])?\.)+(?:[A-Z]{2}|com|org|net|edu|gov|mil|biz|info|mobi|name|aero|asia|jobs|museum)

Então eu preciso executar isso em uma função jQuery como esta:

$j("#fld_emailaddress").live('change',function() { 
var emailaddress = $j("#fld_emailaddress").val();

// validation here? 

if(emailaddress){}

// end validation

$j.ajax({  
        type: "POST",  
         url: "../ff-admin/ff-register/ff-user-check.php",  
        data: "fld_emailaddress="+ emailaddress,  
        success: function(msg)
        { 
            if(msg == 'OK') { 
            $j("#fld_username").attr('disabled',false); 
            $j("#fld_password").attr('disabled',false); 
            $j("#cmd_register_submit").attr('disabled',false); 
            $j("#fld_emailaddress").removeClass('object_error'); // if necessary
            $j("#fld_emailaddress").addClass("object_ok");
            $j('#email_ac').html('&nbsp;<img src="img/cool.png" align="absmiddle"> <font color="Green"> Your email <strong>'+ emailaddress+'</strong> is OK.</font>  ');
            } else {  
            $j("#fld_username").attr('disabled',true); 
            $j("#fld_password").attr('disabled',true); 
            $j("#cmd_register_submit").attr('disabled',true);  
            $j("#fld_emailaddress").removeClass('object_ok'); // if necessary
            $j("#fld_emailaddress").addClass("object_error");
            $j('#email_ac').html(msg);
            }
        }
     });
});

Para onde vai a validação e qual é a expressão?

RussP
fonte

Respostas:

491

ATUALIZAÇÕES


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 */ }
Luca Filosofi
fonte
2
graças aSeptik além de "desaparecidos" do e de mailAddress funciona bem sim saber que não regex 100% existe, mas pode ficar "bonito" perto
RussP
1
não validar que muito profundo, mas ele já me deu um falso positivo para [email protected]
gcb
@ GCB: oi, se o regex não satisfez as suas necessidades, você pode alterá-lo, de qualquer maneira eu testei e ele funciona bem. jsfiddle.net/ADPaM
Luca Filosofi
14
um regex sozinho no lado do cliente, não sabe se existe um servidor de correio nem se o domínio existe. apenas verifica se a sintaxe de qualquer email é válida ou não. É apenas para ajudar o usuário a escrever o endereço correto. não é uma validação.
precisa saber é o seguinte
Funciona perfeito! Obrigado companheiro
28

Esta é a minha solução:

function isValidEmailAddress(emailAddress) {
    var pattern = new RegExp(/^[+a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,4}$/i);
    // alert( pattern.test(emailAddress) );
    return pattern.test(emailAddress);
};

Encontrei o RegExp aqui: http://mdskinner.com/code/email-regex-and-validation-jquery

Bjørn Børresen
fonte
3
seu ponto de vista sobre o sinal de mais é válido, mas seu regex é menos melhor que o que estou usando no meu exemplo. ps: eu atualizei meu regex para suportar o sinal de adição.
Luca Filosofi 21/10
Na maioria das vezes, você só deseja validar se o usuário digitou o email no formato correto. Para identificar erros de digitação como "2" em vez de "@". Então, eu gosto disso melhor do que a resposta original, mas a resposta da aSeptik é abrangente e eu votei nisso também.
Darwindeeds 18/07/12
teste @ gmail..com que dizer do vaild - ERRADO, mudança expressão regular
htngapi
14
$(document).ready(function() {

$('#emailid').focusout(function(){

                $('#emailid').filter(function(){
                   var emil=$('#emailid').val();
              var emailReg = /^([\w-\.]+@([\w-]+\.)+[\w-]{2,4})?$/;
            if( !emailReg.test( emil ) ) {
                alert('Please enter valid email');
                } else {
                alert('Thank you for your valid email');
                }
                })
            });
});
webizon
fonte
8
na verdade, isso foi útil. O título diz JQuery e esta é a única resposta até agora que possui um exemplo de jquery decente.
Taylor Mitchell
isso valida abc.b. @ yahoo.com
NoBullMan
7

Lolz isso é muito melhor

    function isValidEmailAddress(emailAddress) {
        var pattern = new RegExp(/^([\w-\.]+@([\w-]+\.)+[\w-]{2,4})?$/);
        return pattern.test(emailAddress);
    };
Code Spy
fonte
Prefiro sua solução para sites para celular. O outro traria meu smartphone derreter;) +1
Hexodus 27/08
problema de sintaxe em javascript
Sajith
Não validará äüõ etc letras !!
DAH
5

Eu recomendaria que você usasse o plugin jQuery para o Verimail.js .

Por quê?

  • Validação de TLD da IANA
  • Validação de sintaxe (de acordo com a RFC 822)
  • Sugestão ortográfica para os TLDs e domínios de email mais comuns
  • Negar domínios temporários da conta de email, como mailinator.com

Quão?

Inclua verimail.jquery.js no seu site e use a função:

$("input#email-address").verimail({
    messageElement: "p#status-message"
});

Se você possui um formulário e deseja validar o email no envio, pode usar a função getVerimailStatus:

if($("input#email-address").getVerimailStatus() < 0){
    // Invalid email
}else{
    // Valid email
}
Robin Orheden
fonte
1
A Verimail continua validando a digitação, o que significa que, assim que você começa a digitar, você recebe uma mensagem de erro. Geralmente um ótimo plugin, mas este é um diferencial - eu prefiro validar apenas quando acionado manualmente, ou seja, antes de clicar no botão enviar ou sair do campo.
Sebastian Schmid
0

Também podemos usar a expressão regular (/^([\w.-)+)@([\w-)+)((.(\w){2,3})+)$/i) para validar o endereço de e-mail formato está correto ou não.

var emailRegex = new RegExp(/^([\w\.\-]+)@([\w\-]+)((\.(\w){2,3})+)$/i);
 var valid = emailRegex.test(emailAddress);
  if (!valid) {
    alert("Invalid e-mail address");
    return false;
  } else
    return true;
Avinash
fonte
0

Tente isto

function isValidEmailAddress(emailAddress) {
    var pattern = new RegExp(/^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/);
    return pattern.test(emailAddress);
};
Purvik Dhorajiya
fonte
0

você pode usar esta função

 var validateEmail = function (email) {

        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;


        if (pattern.test(email)) {
            return true;
        }
        else {
            return false;
        }
    };
Nikki
fonte
0

Método nativo:

$("#myform").validate({
 // options...
});

$.validator.methods.email = function( value, element ) {
  return this.optional( element ) || /[a-z0-9._%+-]+@[a-z0-9.-]+\.[a-z]{2,4}/.test( value );
}

Fonte: https://jqueryvalidation.org/jQuery.validator.methods/

BroFox
fonte