Convalida dell'email tramite jQuery


Risposte:


703

Puoi usare il vecchio javascript normale per quello:

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

66
Sì, ricordate che jQuery è ancora javascript :)
Fabian,

36
Anche se questa regexp considera validi molti indirizzi del mondo reale, ha ancora molti falsi positivi e falsi negativi. Ad esempio, vedi esempi di indirizzi email validi e non validi su Wikipedia.
Arseny,

1
@Umingo email@127.0.0.1 è ancora valido e-mail, tuttavia, potrebbe ancora essere scritto in modo migliore. Nessuna parte del dominio può iniziare con un carattere diverso da [a-z0-9] (senza distinzione tra maiuscole e minuscole). Inoltre, l'e-mail (e il dominio) validi hanno un limite di len, che non è stato testato.
tomis,

10
Con i nuovi domini di primo livello sempre più comuni, questa regex potrebbe aver bisogno di modificare .systems, .poker ecc. Sono tutti TLD validi ora, ma fallirebbero il controllo regex
Liath,

3
Per il commento di Theo su un'altra risposta, dovresti cambiare var regex = /^([a-zA-Z0-9_.+-])+\@(([a-zA-Z0-9-])+\.)+([a-zA-Z0-9]{2,4})+$/;per var regex = /^([a-zA-Z0-9_.+-])+\@(([a-zA-Z0-9-])+\.)+([a-zA-Z0-9]{2,6})+$/;supportare il nuovo TLD come .museum, ecc.
Ira Herman,

165

Funzione jQuery per convalidare la posta elettronica

Non mi piace usare i plugin, specialmente quando il mio modulo ha un solo campo che deve essere validato. Uso questa funzione e la chiamo ogni volta che devo convalidare un campo del modulo e-mail.

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

e ora per usare questo

if( !validateEmail(emailaddress)) { /* do stuff here */ }

Saluti!


16
Dovresti solo tornareemailReg.test($email);
nffdiogosilva il

7
Solo FYI questo restituisce vero per un indirizzo e-mail vuoto. es emailReg.text("") true. Darei semplicemente la funzione fino alla dichiarazione dell'e-mail Reg quindi questa:return ( $email.length > 0 && emailReg.test($email))
Diziet

14
Il regex per il controllo della validità dell'indirizzo email è obsoleto poiché ora abbiamo estensioni di nomi di dominio con 6 caratteri come .museum, quindi ti consigliamo di passare var emailReg = /^([\w-\.]+@([\w-]+\.)+[\w-]{2,4})?$/;avar emailReg = /^([\w-\.]+@([\w-]+\.)+[\w-]{2,6})?$/;
Theo

3
giusto sei @ h.coates! Sono arrivato a questo thread sperando di scoprire che jQuery in realtà aveva una convalida e-mail integrata. Muoviti, questi non sono i droidi che stai cercando ...
iGanja

3
Il punto di @ Theo è fondamentale, ma la lunghezza effettiva del TLD dovrebbe essere superiore a 6, il limite teorico superiore per l'estensione è di 63 caratteri. attualmente il più lungo ha più di 20 anni vedi data.iana.org/TLD/tlds-alpha-by-domain.txt
Jeroenv3

41

Vorrei utilizzare il plug-in di convalida jQuery per alcuni motivi.

Hai convalidato, ok fantastico, e adesso? Devi visualizzare l'errore, gestirlo cancellandolo quando è valido, mostrando quanti errori totali forse? Ci sono molte cose che può gestire per te, non è necessario reinventare la ruota.

Inoltre, un altro enorme vantaggio è che è ospitato su un CDN, la versione attuale al momento di questa risposta può essere trovata qui: http://www.asp.net/ajaxLibrary/CDNjQueryValidate16.ashx Ciò significa tempi di caricamento più rapidi per il client.


6
Ok ... non è necessario reinventare la ruota. Ma perché devo installare dozzine di KByte di Javascript per convalidare un campo. È come costruire una fabbrica di automobili se tutto ciò di cui hai bisogno è una nuova ruota :)
Kraftb,

3
@kraftb Come indicato nella mia risposta, è la gestione e la visualizzazione intorno alla convalida, non solo alla convalida del testo stesso.
Nick Craver

5
Grazie per questo @NickCraver: questo sembra davvero un approccio "best practice" al problema della gestione della convalida per un'email. Questo sicuramente NON è come costruire una fabbrica (scrivere le librerie per fare tutto il lavoro) per ottenere una ruota. È come seguire le istruzioni dalla fabbrica per installare la ruota su un veicolo moderno (sollevare la macchina, posizionare la ruota - mettere i dadi) invece di cercare di capire come ottenere una ruota del carro sulla tua auto. Questo plugin è semplicissimo da usare. Per eseguire la convalida del modulo è letteralmente un'inclusione, alcune annotazioni e una singola chiamata di metodo.
jfgrissom,

3
Ora stai reinventando la metafora "reinventare la ruota"!
Dom Vinyard,

Per le persone bloccate a lavorare su app webforms encosia.com/using-jquery-validation-with-asp-net-webforms
Jerreck,

38

Guarda http: //bassistance.de/jquery-plugins/jquery-plugin-validation/ . È un bel plug-in jQuery, che consente di creare un potente sistema di validazione per i moduli. Ci sono alcuni esempi utili qui . Quindi, la convalida del campo e-mail nel modulo apparirà così:

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

Consultare la documentazione relativa al metodo e-mail per dettagli e esempi.


1
L'ultimo è ancora vivo)
Andrew Bashtannik

6
ma il formato accettato è x@x( è strano) deve x@x.xCome posso risolverlo?
Basheer AL-MOMANI

2
@ BasheerAL-MOMANI [ jqueryvalidation.org/jQuery.validator.methods/] $.validator.methods.email = function( value, element ) { return this.optional( element ) || //^.+@.+\..+$/.test( value ); }
Bill Gillingham

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

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

: www.htmldrive.net


Fonte: htmldrive.com


14

Consiglierei Verimail.js , ha anche un plugin JQuery .

Perché? Verimail supporta quanto segue:

  • Convalida della sintassi (secondo RFC 822)
  • Convalida TLD IANA
  • Suggerimenti ortografici per i domini di dominio di posta elettronica e domini di posta elettronica più comuni
  • Nega domini di account di posta elettronica temporanei come mailinator.com

Quindi oltre alla convalida, Verimail.js ti dà anche suggerimenti. Quindi, se si digita un'e-mail con TLD o dominio errato che è molto simile a un dominio di posta elettronica comune (hotmail.com, gmail.com, ecc.), È possibile rilevarlo e suggerire una correzione.

Esempi:

  • test@gnail.con -> Intendevi test @ gmail.com ?
  • test@hey.nwt -> Intendevi test @ hey. netto ?
  • test@hottmail.com -> Intendevi test @ hotmail.com ?

E così via..

Per usarlo con jQuery, basta includere verimail.jquery.js sul tuo sito ed eseguire la funzione di seguito:

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

L'elemento message è un elemento in cui verrà mostrato un messaggio. Può trattarsi di tutto, da "La tua email non è valida" a "Intendevi ...?".

Se si dispone di un modulo e si desidera limitarlo in modo che non possa essere inviato a meno che l'e-mail non sia valida, è possibile controllare lo stato utilizzando la funzione getVerimailStatus come mostrato di seguito:

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

Questa funzione restituisce un codice di stato intero in base all'oggetto Comfirm.AlphaMail.Verimail.Status. Ma la regola generale è che tutti i codici inferiori a 0 sono codici che indicano errori.


.getVerimailStatus()non restituisce codici di stato numerici, solo un valore di stringa success, erroro eventualmente pending(non verificare l'ultima).
Niko Nyman,

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

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

questo è stato fornito dall'utente Luca Filosofi in questa risposta a questa risposta


Se lo usi nella pagina Rasoio ASP.NET MVC, non dimenticare di sfuggire al @personaggio con un altro @personaggio. In questo modo @@, altrimenti otterrai l'errore di compilazione.
Rosdi Kasim,


10

Ciò esegue una convalida più approfondita, ad esempio verifica i punti successivi nel nome utente come 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);
}

Vedi l'indirizzo e-mail valido utilizzando l'espressione regolare in JavaScript .


1
Ma i punti successivi non sono effettivamente validi? Al contrario, penso che escluderesti indirizzi email validi facendo questo.
icktoofay,

9

Come altri hanno già detto, puoi usare una regex per verificare se l'indirizzo e-mail corrisponde a un modello. Ma puoi ancora avere e-mail che corrispondono allo schema ma il mio rimbalza ancora o sono e-mail di spam fasulle.

controllando con una regex

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

verifica con un'API di convalida email reale

Puoi utilizzare un'API che controllerà se l'indirizzo email è reale e attualmente attivo.

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

Per ulteriori informazioni, consultare https://isitarealemail.com o post di blog


8

Se si dispone di un modulo di base, è sufficiente inserire il tipo di email: <input type="email" required>

Questo funzionerà per i browser che utilizzano gli attributi HTML5 e quindi non hai nemmeno bisogno di JS. Il solo utilizzo della convalida dell'email anche con alcuni degli script sopra non farà molto poiché:

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

ecc ... Verranno convalidati come e-mail "reali". Quindi sarebbe meglio assicurarsi che l'utente debba inserire il proprio indirizzo e-mail due volte per assicurarsi che abbia inserito lo stesso. Ma garantire che l'indirizzo e-mail sia reale sarebbe molto difficile ma molto interessante vedere se ci fosse un modo. Ma se stai solo assicurando che si tratti di un'email, segui l'input HTML5.

ESEMPIO FIDDLE

Funziona con FireFox e Chrome. Potrebbe non funzionare in Internet Explorer ... Ma Internet Explorer fa schifo. Quindi c'è quello ...


Il metodo regexp di solito impedisce email chiaramente stupide come un @ bc (che il tuo esempio JSFiddle collegato consente di utilizzare l'ultimo Chrome), quindi la soluzione HTML5 è chiaramente una soluzione inadeguata.
SnowInferno,

freddo. Quindi che ne dici di usare il match pattern come HTML5? Perché non provi questo nel tuo Chromebook: jsfiddle.net/du676/8
isaac weathers

8

Convalida e-mail Javascript in MVC / ASP.NET

Il problema che ho riscontrato durante l'utilizzo della risposta di Fabian è l'implementazione in una vista MVC a causa del @simbolo Razor . Devi includere un @simbolo aggiuntivo per evitarlo, in questo modo:@@

Per evitare il rasoio in MVC

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

Non l'ho visto altrove in questa pagina, quindi ho pensato che potesse essere utile.

MODIFICARE

Ecco un link di Microsoft che ne descrive l'utilizzo.
Ho appena testato il codice sopra e ho ottenuto i seguenti js:

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

Che sta facendo esattamente quello che dovrebbe fare.


@nbrogi Cosa vuoi dire con questo non funziona? Ho appena verificato di nuovo e questo produce i seguenti js var regex = /^([a-zA-Z0-9_.+-])+\@(([a-zA-Z0-9-])+\.)+([a-zA-Z0-9]{2,4})+$/; Cosa sta succedendo al tuo codice?
Trevor Nestman,

Spiacente, non sono sicuro al momento, l'ho completamente cambiato.
nkkollaw,

Per favore fatemi sapere quando è possibile. Se questa è una cattiva informazione, la eliminerò. Cerco di fornire informazioni utili quando possibile e questo mi ha aiutato quando scrivevo una regex in una vista MVC.
Trevor Nestman,

Ancora una volta, vorrei sapere perché questo è stato sottoposto a downgrade. Fa esattamente quello che lo desidero e che produce il @simbolo in una regex in .cshtml. Normalmente proverebbe a trattare ogni cosa dopo il @simbolo come un codice rasoio, ma il doppio lo @@impedisce.
Trevor Nestman,

il problema principale che vedo è nel secondo blocco del codice il tuo regex è impostato su una variabile chiamata regex, ma la seconda riga usa una variabile chiamata re
phlare

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

Usa così:

if( !isValidEmail(myEmail) ) { /* do things if myEmail is valid. */ }

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

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" />

4

Atterrato qui ..... finito qui: https://html.spec.whatwg.org/multipage/forms.html#valid-e-mail-address

... che ha fornito la seguente 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])?)*$/

... che ho trovato grazie ad una nota sul file Leggimi del plugin jQuery Validation: https://github.com/jzaefferer/jquery-validation/blob/master/README.md#reporting-an-issue

Così, la versione aggiornata di @Fabian 's risposta sarebbe:

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

spero che aiuti


Questa è stata la risposta migliore per me - è tornata vera john..doe@example.comma vorrei che fosse falsa
Adam Knights,

3

Usa questo

if ($this.hasClass('tb-email')) {
    var email = $this.val();
    var txt = /^([a-zA-Z0-9_\.\-\+])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/;
    if (!txt.test(email)) {
        e.preventDefault();
        $this.addClass('error');
    } else {
        $this.removeClass('error');
    }
}

3

Il bug è nel plug-in di convalida della convalida di Jquery Convalida solo con @ per modificarlo

cambia il codice in questo

email: function( value, element ) {
    // From http://www.whatwg.org/specs/web-apps/current-work/multipage/states-of-the-type-attribute.html#e-mail-state-%28type=email%29
    // Retrieved 2014-01-14
    // If you have a problem with this implementation, report a bug against the above spec
    // Or use custom methods to implement your own email validation
    return this.optional( element ) || /^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/.test( value );
}

3

Per coloro che vogliono usare una soluzione migliore da mantenere rispetto alle dirompenti partite RegEx di lunga durata, ho scritto alcune righe di codice. Coloro che vogliono salvare byte, attenersi alla variante RegEx :)

Questo limita:

  • No @ in stringa
  • Nessun punto nella stringa
  • Più di 2 punti dopo @
  • Caratteri errati nel nome utente (prima di @)
  • Più di 2 @ in stringa
  • Caratteri errati nel dominio
  • Caratteri non validi nel sottodominio
  • Caratteri non validi in TLD
  • TLD - indirizzi

Ad ogni modo, è ancora possibile trapelare, quindi assicurati di combinare questo con una convalida sul lato server + verifica del collegamento e-mail.

Ecco il JSFiddle

 //validate email

var emailInput = $("#email").val(),
    emailParts = emailInput.split('@'),
    text = 'Enter a valid e-mail address!';

//at least one @, catches error
if (emailParts[1] == null || emailParts[1] == "" || emailParts[1] == undefined) { 

    yourErrorFunc(text);

} else {

    //split domain, subdomain and tld if existent
    var emailDomainParts = emailParts[1].split('.');

    //at least one . (dot), catches error
    if (emailDomainParts[1] == null || emailDomainParts[1] == "" || emailDomainParts[1] == undefined) { 

        yourErrorFunc(text); 

     } else {

        //more than 2 . (dots) in emailParts[1]
        if (!emailDomainParts[3] == null || !emailDomainParts[3] == "" || !emailDomainParts[3] == undefined) { 

            yourErrorFunc(text); 

        } else {

            //email user
            if (/[^a-z0-9!#$%&'*+-/=?^_`{|}~]/i.test(emailParts[0])) {

               yourErrorFunc(text);

            } else {

                //double @
                if (!emailParts[2] == null || !emailParts[2] == "" || !emailParts[2] == undefined) { 

                        yourErrorFunc(text); 

                } else {

                     //domain
                     if (/[^a-z0-9-]/i.test(emailDomainParts[0])) {

                         yourErrorFunc(text); 

                     } else {

                         //check for subdomain
                         if (emailDomainParts[2] == null || emailDomainParts[2] == "" || emailDomainParts[2] == undefined) { 

                             //TLD
                             if (/[^a-z]/i.test(emailDomainParts[1])) {

                                 yourErrorFunc(text);

                              } else {

                                 yourPassedFunc(); 

                              }

                        } else {

                             //subdomain
                             if (/[^a-z0-9-]/i.test(emailDomainParts[1])) {

                                 yourErrorFunc(text); 

                             } else {

                                  //TLD
                                  if (/[^a-z]/i.test(emailDomainParts[2])) {

                                      yourErrorFunc(text); 

                                  } else {

                                      yourPassedFunc();
}}}}}}}}}

3

È possibile utilizzare jQuery Validation e, in un'unica riga HTML, è possibile convalidare l'e-mail e il messaggio di convalida dell'e-mail:type="email" required data-msg-email="Enter a valid email account!"

È possibile utilizzare il parametro data-msg-email per inserire un messaggio personalizzato o altrimenti non posizionare questo parametro e verrà visualizzato il messaggio predefinito: "Inserire un indirizzo e-mail valido".

Esempio completo:

<form class="cmxform" id="commentForm" method="get" action="">
  <fieldset>
    <p>
      <label for="cemail">E-Mail (required)</label>
      <input id="cemail" type="email" name="email" required data-msg-email="Enter a valid email account!">
    </p>
    <p>
      <input class="submit" type="submit" value="Submit">
    </p>
  </fieldset>
</form>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/jquery-validation@1.17.0/dist/jquery.validate.js"></script>
<script>
$("#commentForm").validate();
</script>

2
if($("input#email-address").getVerimailStatus() < 0) { 

(incorrect code)

}

if($("input#email-address").getVerimailStatus() == 'error') { 

(right code)

}

9
Puoi elaborare la tua risposta ... ad esempio, dovresti dire che getVerimailStatus è un plugin aggiuntivo.
Dave Hogan,

2
checkRegexp( email, /^((([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, "eg. ui@jquery.com" );

Riferimento: SITO INTERNET JQUERY



2

Un'altra opzione semplice e completa:

<input type="text" id="Email"/>
<div id="ClasSpan"></div>   
<input id="ValidMail" type="submit"  value="Valid"/>  


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

$("#ValidMail").click(function () {
    $('span', '#ClasSpan').empty().remove();
    if (IsEmail($("#Email").val())) {
        //aqui mi sentencia        
    }
    else {
        $('#ClasSpan').append('<span>Please enter a valid email</span>');
        $('#Email').keypress(function () {
            $('span', '#itemspan').empty().remove();
        });
    }
});

3
Stack Overflow è un sito in inglese. Si prega di non pubblicare contenuti in altre lingue.
Anders,

2

Puoi creare la tua funzione

function emailValidate(email){
    var check = "" + email;
    if((check.search('@')>=0)&&(check.search(/\./)>=0))
        if(check.search('@')<check.split('@')[1].search(/\./)+check.search('@')) return true;
        else return false;
    else return false;
}

alert(emailValidate('your.email@yahoo.com'));

1

Uno semplificato che ho appena fatto, fa quello di cui ho bisogno. L'ho limitato a solo alfanumerico, punto, trattino basso e @.

<input onKeyUp="testEmailChars(this);"><span id="a"></span>
function testEmailChars(el){
    var email = $(el).val();
    if ( /^[a-zA-Z0-9_@.-]+$/.test(email)==true ){
        $("#a").html("valid");
    } else {
        $("#a").html("not valid");
    }
}

Realizzato con l'aiuto di altri


1

Questo regexp impedisce nomi di dominio duplicati come abc@abc.com.com.com, consentirà solo due volte il dominio come abc@abc.co.in. Inoltre, non consente lo statring da numeri come 123abc@abc.com

 regexp: /^([a-zA-Z])+([a-zA-Z0-9_.+-])+\@(([a-zA-Z])+\.+?(com|co|in|org|net|edu|info|gov|vekomy))\.?(com|co|in|org|net|edu|info|gov)?$/, 

Ti auguro il meglio !!!!!


1

Convalida l'e-mail durante la digitazione, con la gestione dello stato dei pulsanti.

$("#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();
    }
  });

1

se stai usando convalida jquery

Ho creato un metodo emailCustomFormatche ha usato regexper il mio formato personalizzato che puoi modificare per soddisfare i tuoi requisiti

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

allora puoi usarlo in questo modo

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

questa regex accetta

abc@abc.abc, abc@abc.abcd ma non questo

abc@abc , abc@abc.a ,abc@abc.abcde

spero che questo ti aiuti

Utilizzando il nostro sito, riconosci di aver letto e compreso le nostre Informativa sui cookie e Informativa sulla privacy.
Licensed under cc by-sa 3.0 with attribution required.