Validasi email menggunakan jQuery


Jawaban:


703

Anda dapat menggunakan javascript lama biasa untuk itu:

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

66
Ya itu akan, ingat jQuery masih javascript :)
Fabian

36
Meskipun regexp ini menganggap sebagian besar alamat dunia nyata valid, ia masih memiliki banyak positif palsu dan negatif palsu. Misalnya, lihat contoh alamat email yang valid dan tidak valid di Wikipedia.
Arseny

1
@Umingo email@127.0.0.1 masih merupakan email yang valid, namun, masih bisa ditulis dengan cara yang lebih baik. Tidak ada bagian dari domain yang dapat dimulai dengan karakter selain [a-z0-9] (case-sensitive). Selain itu, e-mail (dan domain) yang valid memiliki batas beberapa, yang juga tidak diuji.
Tomomi

10
Dengan domain tingkat atas yang baru menjadi lebih umum, regex ini mungkin perlu memodifikasi .sistem dan .poker dll semua adalah TLD yang valid sekarang tetapi akan gagal dengan pemeriksaan regex
Liath

3
Per Theo mengomentari jawaban lain, Anda harus beralih var regex = /^([a-zA-Z0-9_.+-])+\@(([a-zA-Z0-9-])+\.)+([a-zA-Z0-9]{2,4})+$/;ke var regex = /^([a-zA-Z0-9_.+-])+\@(([a-zA-Z0-9-])+\.)+([a-zA-Z0-9]{2,6})+$/;untuk mendukung TLD yang lebih baru seperti .museum, dll
Ira Herman

165

Fungsi jQuery untuk Memvalidasi Email

Saya benar-benar tidak suka menggunakan plugin, terutama ketika formulir saya hanya memiliki satu bidang yang perlu divalidasi. Saya menggunakan fungsi ini dan menyebutnya kapan pun saya perlu memvalidasi bidang formulir email.

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

dan sekarang untuk menggunakan ini

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

Bersulang!


16
Anda harus kembaliemailReg.test($email);
nffdiogosilva

7
Hanya FYI ini mengembalikan true untuk alamat email kosong. mis emailReg.text("") true. Saya hanya akan fungsi ke deklarasi emailReg var maka ini:return ( $email.length > 0 && emailReg.test($email))
Diziet

14
Regex untuk memeriksa validitas alamat surel sudah usang karena kami sekarang memiliki ekstensi nama domain dengan 6 karakter seperti .museum, karenanya Anda ingin mengubahnya var emailReg = /^([\w-\.]+@([\w-]+\.)+[\w-]{2,4})?$/;menjadivar emailReg = /^([\w-\.]+@([\w-]+\.)+[\w-]{2,6})?$/;
Theo

3
benar kamu adalah @ h.coates! Saya datang ke utas ini berharap menemukan bahwa jQuery sebenarnya memiliki validasi email bawaan. Bergeraklah, ini bukan droid yang Anda cari ...
iGanja

3
@ Theo point sangat penting, tetapi panjang sebenarnya dari TLD harus lebih dari 6, batas atas teoritis untuk ekstensi adalah 63 karakter. saat ini yang terpanjang adalah lebih dari 20 lihat data.iana.org/TLD/tlds-alpha-by-domain.txt
Jeroenv3

41

Saya akan menggunakan plugin validasi jQuery karena beberapa alasan.

Anda divalidasi, oke, sekarang apa? Anda perlu menampilkan kesalahan, menangani menghapusnya ketika valid, menampilkan berapa banyak total kesalahan mungkin? Ada banyak hal yang bisa ditangani untuk Anda, tidak perlu menemukan kembali roda.

Juga, manfaat besar lainnya adalah di-host di CDN, versi saat ini pada saat jawaban ini dapat ditemukan di sini: http://www.asp.net/ajaxLibrary/CDNjQueryValidate16.ashx Ini berarti waktu muat yang lebih cepat untuk klien.


6
Ok ... tidak perlu menemukan kembali roda. Tetapi mengapa saya harus menginstal puluhan KByte dari Javascript untuk memvalidasi suatu bidang. Ini seperti membangun pabrik mobil jika semua yang Anda butuhkan adalah roda baru :)
kraftb

3
@ kraftb Seperti yang dinyatakan dalam jawaban saya, ini adalah penanganan dan tampilan di sekitar validasi, bukan hanya memvalidasi teks itu sendiri.
Nick Craver

5
Terima kasih atas @NickCraver ini: Ini benar-benar terlihat sebagai pendekatan "praktik terbaik" untuk masalah penanganan validasi untuk email. Ini tentunya TIDAK seperti membangun pabrik (menulis lib untuk melakukan semua pekerjaan) untuk mendapatkan roda. Ini seperti mengikuti instruksi dari pabrik untuk memasang roda pada kendaraan modern (dongkrak mobil, letakkan roda - pasang mur roda) daripada mencoba mencari cara bagaimana mendapatkan roda gerobak di mobil Anda. Plugin ini sangat mudah digunakan. Untuk melakukan validasi formulir, itu benar-benar sebuah include, beberapa anotasi, dan pemanggilan metode tunggal.
jfgrissom

3
Sekarang Anda menemukan kembali metafora 'reinventing the wheel'!
Dom Vinyard

Untuk orang-orang yang terjebak mengerjakan aplikasi formulir web encosia.com/using-jquery-validation-with-asp-net-webforms
Jerreck

38

Lihatlah http: //bassistance.de/jquery-plugins/jquery-plugin-validation/ . Ini adalah plugin jQuery yang bagus, yang memungkinkan untuk membangun sistem validasi yang kuat untuk formulir. Ada beberapa contoh yang berguna di sini . Jadi, validasi bidang email dalam bentuk akan terlihat seperti ini:

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

Lihat dokumentasi metode Email untuk detail dan sampel.


1
Yang terakhir masih hidup)
Andrew Bashtannik

6
tetapi format yang diterima adalah x@x(itu aneh) itu harus x@x.xBagaimana saya bisa memperbaikinya?
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


Sumber: htmldrive.com


14

Saya akan merekomendasikan Verimail.js , ia juga memiliki plugin JQuery .

Mengapa? Verimail mendukung yang berikut ini:

  • Validasi sintaksis (menurut RFC 822)
  • Validasi IANA TLD
  • Saran pengejaan untuk TLD dan domain email paling umum
  • Tolak domain akun email sementara seperti mailinator.com

Jadi selain validasi, Verimail.js juga memberi Anda saran. Jadi, jika Anda mengetik email dengan TLD atau domain yang salah yang sangat mirip dengan domain email umum (hotmail.com, gmail.com, dll), itu bisa mendeteksi ini dan menyarankan koreksi.

Contoh:

  • test@gnail.con -> Apakah maksud Anda test @ gmail.com ?
  • test@hey.nwt -> Apakah maksud Anda test @ hey. bersih ?
  • test@hottmail.com -> Apakah maksud Anda test @ hotmail.com ?

Dan seterusnya..

Untuk menggunakannya dengan jQuery, cukup sertakan verimail.jquery.js di situs Anda dan jalankan fungsi di bawah ini:

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

Elemen pesan adalah elemen di mana pesan akan ditampilkan. Ini bisa semuanya mulai dari "Email Anda tidak valid" hingga "Apakah maksud Anda ...?".

Jika Anda memiliki formulir dan ingin membatasi sehingga tidak dapat dikirimkan kecuali emailnya valid, maka Anda dapat memeriksa status menggunakan fungsi getVerimailStatus seperti yang ditunjukkan di bawah ini:

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

Fungsi ini mengembalikan kode status integer sesuai dengan objek Comfirm.AlphaMail.Verimail.Status. Tetapi aturan umum adalah bahwa setiap kode di bawah 0 adalah kode yang menunjukkan kesalahan.


.getVerimailStatus()tidak mengembalikan kode status numerik, hanya nilai string success, erroratau mungkin pending(tidak memverifikasi yang terakhir).
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) */ }

ini disediakan oleh pengguna Luca Filosofi dalam jawaban ini


Jika Anda menggunakan ini di halaman ASP.NET MVC Razor, jangan lupa untuk keluar dari @karakter dengan @karakter lain . Seperti itu @@, jika tidak, Anda akan mendapatkan galat build.
Rosdi Kasim

11

Solusi yang sangat sederhana adalah dengan menggunakan validasi HTML5:

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

  <input type="submit">
</form>

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


10

Ini melakukan validasi yang lebih menyeluruh, misalnya memeriksa terhadap titik-titik berturut-turut dalam nama pengguna seperti 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);
}

Lihat memvalidasi alamat email menggunakan ekspresi reguler dalam JavaScript .


1
Tetapi apakah titik-titik yang berurutan benar-benar tidak valid? Sebaliknya saya pikir Anda tidak akan memasukkan alamat email yang valid dengan melakukan itu.
icktoofay

9

Seperti yang disebutkan orang lain, Anda dapat menggunakan regex untuk memeriksa apakah alamat email cocok dengan suatu pola. Tetapi Anda masih dapat memiliki email yang sesuai dengan pola tetapi saya masih bouncing atau email spam palsu.

memeriksa dengan regex

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

memeriksa dengan API validasi email nyata

Anda dapat menggunakan API yang akan memeriksa apakah alamat email itu asli dan saat ini aktif.

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

Untuk lebih lanjut lihat https://isitarealemail.com atau posting blog


8

Jika Anda memiliki formulir dasar, cukup buat jenis masukan email: <input type="email" required>

Ini akan berfungsi untuk browser yang menggunakan atribut HTML5 dan kemudian Anda bahkan tidak perlu JS. Hanya menggunakan validasi email bahkan dengan beberapa skrip di atas tidak akan banyak membantu sejak:

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

dll ... Semua akan divalidasi sebagai email "nyata". Jadi Anda akan lebih baik memastikan bahwa pengguna harus memasukkan alamat email mereka dua kali untuk memastikan bahwa mereka memasukkan yang sama. Tetapi untuk memastikan bahwa alamat email itu asli akan sangat sulit tetapi sangat menarik untuk melihat apakah ada cara. Tetapi jika Anda hanya memastikan bahwa itu adalah email, tetap pada input HTML5.

CONTOH FIDDLE

Ini berfungsi di FireFox dan Chrome. Ini mungkin tidak berfungsi di Internet Explorer ... Tapi internet explorer sucks. Jadi ada itu ...


Metode regexp biasanya mencegah email-email konyol seperti @ bc (contoh JSFiddle yang ditautkan memungkinkan Anda menggunakan Chrome terbaru), sehingga solusi HTML5 jelas merupakan solusi yang tidak memadai.
SnowInferno

keren. Jadi bagaimana kalau hanya menggunakan pencocokan pola seperti HTML5 yang "seharusnya" dilakukan? Mengapa Anda tidak mencoba ini di chromebook Anda: jsfiddle.net/du676/8
isaac weathers

8

Validasi Email Javascript di MVC / ASP.NET

Masalah yang saya temui saat menggunakan jawaban Fabian, adalah mengimplementasikannya dalam tampilan MVC karena @simbol Razor . Anda harus menyertakan @simbol tambahan untuk menghindarinya, seperti:@@

Untuk Menghindari Razor Di MVC

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

Saya tidak melihatnya di tempat lain di halaman ini, jadi saya pikir ini mungkin membantu.

EDIT

Berikut ini tautan dari Microsoft yang menjelaskan penggunaannya.
Saya baru saja menguji kode di atas dan mendapat js berikut:

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

Yang melakukan persis apa yang seharusnya dilakukan.


@nbrogi Apa maksudmu ini tidak berhasil? Saya baru saja memeriksa ini lagi dan ini menghasilkan js berikut var regex = /^([a-zA-Z0-9_.+-])+\@(([a-zA-Z0-9-])+\.)+([a-zA-Z0-9]{2,4})+$/; Apa yang terjadi pada kode Anda?
Trevor Nestman

Maaf, saya tidak yakin saat ini, saya benar-benar mengubahnya.
nkkollaw

Tolong beri tahu saya kapan Anda bisa. Jika ini informasi yang buruk, maka saya akan menghapusnya. Saya mencoba menyumbangkan informasi yang membantu bila memungkinkan dan ini membantu saya ketika menulis regex dalam tampilan MVC.
Trevor Nestman

Sekali lagi, saya ingin tahu mengapa ini diturunkan. Itu tidak persis apa yang saya inginkan yang menghasilkan @simbol dalam regex di .cshtml. Biasanya itu akan mencoba memperlakukan semuanya setelah @simbol sebagai kode silet, tetapi ganda @@mencegahnya.
Trevor Nestman

Masalah utama yang saya lihat adalah di codeblock kedua regex Anda diatur ke variabel bernama regex, tetapi baris kedua menggunakan variabel bernama 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);
};

Gunakan Seperti Ini:

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

Mendarat di sini ..... berakhir di sini: https://html.spec.whatwg.org/multipage/forms.html#valid-e-mail-address

... yang menyediakan regex berikut:

/^[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])?)*$/

... yang saya temukan berkat catatan di plugin jQuery Validation readme: https://github.com/jzaefferer/jquery-validation/blob/master/README.md#reporting-an-issue

Jadi, versi terbaru dari @Fabian 's jawabannya akan:

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

Semoga itu bisa membantu


Yang ini adalah jawaban terbaik untuk saya - itu kembali benar john..doe@example.comtetapi ingin itu salah
Adam Knights

3

Gunakan ini

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

Bug ada di Jquery Validation Validation Plugin Hanya memvalidasi dengan @ untuk mengubahnya

ubah kode menjadi ini

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

Untuk mereka yang ingin menggunakan solusi yang dapat dikelola lebih baik daripada mengganggu RegEx tahun cahaya, saya menulis beberapa baris kode. Mereka yang ingin menyimpan byte, tetap pada varian RegEx :)

Ini membatasi:

  • Tidak ada @ dalam string
  • Tidak ada titik dalam string
  • Lebih dari 2 titik setelah @
  • Karakter buruk pada nama pengguna (sebelum @)
  • Lebih dari 2 @ dalam string
  • Karakter buruk di domain
  • Karakter buruk di subdomain
  • Karakter buruk di TLD
  • TLD - alamat

Bagaimanapun, masih mungkin bocor, jadi pastikan Anda menggabungkan ini dengan validasi sisi server + verifikasi tautan email.

Ini 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

Anda dapat menggunakan Validasi jQuery dan, dalam satu baris HTML, Anda dapat memvalidasi email dan pesan validasi email:type="email" required data-msg-email="Enter a valid email account!"

Anda dapat menggunakan parameter data-msg-email untuk menempatkan pesan yang dipersonalisasi atau jika tidak menempatkan parameter ini dan pesan default akan ditampilkan: "Silakan masukkan alamat email yang valid."

Contoh lengkap:

<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
Bisakah Anda menguraikan jawaban Anda ... misalnya Anda harus menyebutkan bahwa getVerimailStatus adalah plugin tambahan.
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" );

Referensi: SITUS WEB JQUERY UI



2

Opsi sederhana dan lengkap lainnya:

<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 adalah situs dalam bahasa Inggris. Tolong jangan memposting konten dalam bahasa lain.
Anders

2

Anda dapat membuat fungsi Anda sendiri

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

Yang disederhanakan yang baru saja saya buat, melakukan apa yang saya butuhkan. Hanya sebatas alfanumerik, titik, garis bawah, dan @.

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

Dibuat dengan bantuan orang lain


1

Regexp ini mencegah duplikasi nama domain seperti abc@abc.com.com.com.com, ini hanya akan memungkinkan domain dua kali seperti abc@abc.co.in. Itu juga tidak memungkinkan statring dari nomor seperti 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)?$/, 

Semua yang terbaik !!!!!


1

Validasi email saat mengetik, dengan penanganan kondisi tombol.

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

jika Anda menggunakan validasi jquery

Saya membuat metode emailCustomFormatyang digunakan regexuntuk format custm saya, Anda dapat mengubahnya untuk memenuhi persyaratan Anda

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

maka kamu bisa menggunakannya seperti ini

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

regex ini menerima

abc@abc.abc, abc@abc.abcd tapi tidak ini

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

Semoga ini bisa membantu Anda

Dengan menggunakan situs kami, Anda mengakui telah membaca dan memahami Kebijakan Cookie dan Kebijakan Privasi kami.
Licensed under cc by-sa 3.0 with attribution required.