Validación de direcciones de correo electrónico usando jQuery y regex


174

No estoy muy seguro de cómo hacer esto. Necesito validar las direcciones de correo electrónico usando regex con algo como esto:

[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)

Entonces necesito ejecutar esto en una función 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);
            }
        }
     });
});

¿A dónde va la validación y cuál es la expresión?


Respuestas:


491

ACTUALIZACIONES


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 */ }

2
gracias Aseptik aparte de "perdido" la dirección de direccióndecorreo funciona bien si sabe que no existe una expresión regular 100%, pero puede ser "bastante" cerca
RussP

1
no lo validó demasiado, pero ya me dio un falso positivo para asdf@adsf.com
gcb

@ gcb: hola, si la expresión regular no satisfizo tus necesidades, puedes cambiarla, de todos modos lo he probado y funciona bien. jsfiddle.net/ADPaM
Luca Filosofi

14
una expresión regular sola en el lado del cliente, no sabe si hay un servidor de correo ni si el dominio en sí existe. Merly comprueba si la sintaxis de cualquier correo electrónico es válida o no. Es solo para ayudar al usuario a escribir la dirección correcta. No es una validación.
BerggreenDK

Funciona perfecto! Gracias amigo

28

Esta es mi solución:

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);
};

Encontré que RegExp por aquí: http://mdskinner.com/code/email-regex-and-validation-jquery


3
su punto sobre el signo más es válido, pero su expresión regular es menos mejor que la que estoy usando en mi ejemplo. ps: he actualizado mi expresión regular para admitir el signo más.
Luca Filosofi

La mayoría de las veces solo desea validar que el usuario ingresó el correo electrónico en el formato correcto. Para identificar errores tipográficos como "2" en lugar de "@". Así que me gusta más que la respuesta original, pero la respuesta de aSeptik es exhaustiva y también voté a favor.
darwindeeds

test @ gmail..com dice vaild - WRONG, change regular expression
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');
                }
                })
            });
});

8
En realidad esto fue útil. El título dice JQuery y esta es la única respuesta hasta ahora que tiene un ejemplo decente de jquery.
Taylor Mitchell

esto valida abc.b. @ yahoo.com
NoBullMan

7

Lolz esto es mucho mejor

    function isValidEmailAddress(emailAddress) {
        var pattern = new RegExp(/^([\w-\.]+@([\w-]+\.)+[\w-]{2,4})?$/);
        return pattern.test(emailAddress);
    };

Prefiero su solución para sitios web móviles. El otro haría que mi teléfono inteligente se derritiera;) +1
Hexodus

problema de sintaxis en JavaScript
Sajith

¡No validará letras äüõ, etc.!
DAH

5

Le recomendaría que use el complemento jQuery para Verimail.js .

¿Por qué?

  • IANA TLD validation
  • Validación de sintaxis (según RFC 822)
  • Sugerencia de ortografía para los TLD y dominios de correo electrónico más comunes
  • Denegar dominios temporales de cuentas de correo electrónico como mailinator.com

¿Cómo?

Incluya verimail.jquery.js en su sitio y use la función:

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

Si tiene un formulario y desea validar el correo electrónico al enviar, puede usar la función getVerimailStatus:

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

1
Verimail sigue validando en keyup, lo que significa que, tan pronto como comience a escribir, recibirá un mensaje de error. En general, es un complemento excelente, pero este es un factor decisivo: preferiría validar solo cuando se active manualmente, es decir, antes de hacer clic en el botón Enviar o abandonar el campo.
Sebastian Schmid


0

También podemos usar la expresión regular (/^([\w.-font>+)@([\w-font>+)((.(\w){2,3})+)$/i) para validar la dirección de correo electrónico El formato es correcto o no.

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;

0

Prueba esto

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);
};

0

puedes usar esta función

 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;
        }
    };

Al usar nuestro sitio, usted reconoce que ha leído y comprende nuestra Política de Cookies y Política de Privacidad.
Licensed under cc by-sa 3.0 with attribution required.