การตรวจสอบอีเมลโดยใช้ jQuery


356

ฉันใหม่กับ jQuery และสงสัยว่าจะใช้มันเพื่อตรวจสอบที่อยู่อีเมล


ก่อนที่จะพยายาม "ตรวจสอบความถูกต้อง" ที่อยู่อีเมลคุณควรอ่านสิ่งนี้: hackernoon.com/ …
Mikko Rantalainen

คำตอบ:


703

คุณสามารถใช้จาวาสคริปต์เก่าแบบปกติเพื่อ:

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

66
ใช่มันจะจำ jQuery ยังคงจาวาสคริปต์ :)
Fabian

36
แม้ว่า regexp นี้จะพิจารณาที่อยู่ในโลกแห่งความเป็นจริงส่วนใหญ่ก็ยังคงมีอยู่ แต่ก็มีผลบวกปลอมและเชิงลบจำนวนมาก ตัวอย่างเช่นดูตัวอย่างที่อยู่อีเมลที่ถูกต้องและไม่ถูกต้องใน Wikipedia
Arseny

1
@Umingo email@127.0.0.1 ยังคงเป็นอีเมลที่ถูกต้อง แต่ก็ยังสามารถเขียนได้ดีกว่า ไม่มีส่วนใดของโดเมนที่สามารถเริ่มต้นด้วยอักขระอื่นที่ไม่ใช่ [a-z0-9] (case insensitive) นอกจากนี้อีเมลที่ถูกต้อง (และโดเมน) มีขีด จำกัด บางอย่างซึ่งไม่ได้ทดสอบ
tomis

10
กับโดเมนระดับบนสุดใหม่กลายเป็นเรื่องธรรมดามากขึ้น regex นี้อาจต้องมีการแก้ไข. systems และ. โป๊กเกอร์ ฯลฯ เป็น TLD ที่ถูกต้องทั้งหมดในขณะนี้ แต่จะล้มเหลวในการตรวจสอบ regex
Liath

3
ตามความคิดเห็นของ Theo ต่อคำตอบอื่นคุณควรเปลี่ยนvar regex = /^([a-zA-Z0-9_.+-])+\@(([a-zA-Z0-9-])+\.)+([a-zA-Z0-9]{2,4})+$/;เป็นvar regex = /^([a-zA-Z0-9_.+-])+\@(([a-zA-Z0-9-])+\.)+([a-zA-Z0-9]{2,6})+$/;สนับสนุนพิพิธภัณฑ์ใหม่เช่น. พิพิธภัณฑ์ ฯลฯ
Ira Herman

164

ฟังก์ชั่น jQuery เพื่อตรวจสอบอีเมล

ฉันไม่ชอบใช้ปลั๊กอินโดยเฉพาะอย่างยิ่งเมื่อฟอร์มของฉันมีเพียงหนึ่งฟิลด์ที่ต้องมีการตรวจสอบความถูกต้อง ฉันใช้ฟังก์ชั่นนี้และเรียกมันเมื่อใดก็ตามที่ฉันต้องการตรวจสอบความถูกต้องของเขตข้อมูลแบบฟอร์มอีเมล

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

และตอนนี้ที่จะใช้สิ่งนี้

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

ไชโย!


16
คุณควรจะกลับมาemailReg.test($email);
nffdiogosilva

7
เพียงแค่ FYI สิ่งนี้จะคืนค่าเป็นจริงสำหรับที่อยู่อีเมลเปล่า emailReg.text("") trueเช่น ฉันต้องการเพียงแค่ฟังก์ชั่นลงไปประกาศของ var emailReg แล้วนี้:return ( $email.length > 0 && emailReg.test($email))
Diziet

14
regex สำหรับการตรวจสอบความถูกต้องของที่อยู่อีเมลนั้นล้าสมัยแล้วเนื่องจากเรามีส่วนขยายชื่อโดเมนที่มี 6 ตัวอักษรเช่น. พิพิธภัณฑ์ดังนั้นคุณต้องการเปลี่ยน var emailReg = /^([\w-\.]+@([\w-]+\.)+[\w-]{2,4})?$/;เป็นvar emailReg = /^([\w-\.]+@([\w-]+\.)+[\w-]{2,6})?$/;
Theo

3
ใช่คุณเป็น @ h.coates! ฉันมาที่กระทู้นี้โดยหวังว่าจะพบว่า jQuery มีการตรวจสอบอีเมลในตัว ย้ายไปเลยหุ่นเหล่านี้ไม่ใช่สิ่งที่คุณกำลังมองหา ...
iGanja

3
@ ประเด็นของธีโอนั้นสำคัญ แต่ความยาวจริงของ TLD ควรมากกว่า 6 ขีด จำกัด บนของทฤษฎีสำหรับส่วนขยายคือ 63 อักขระ ปัจจุบันหนึ่งที่ยาวที่สุดคือมากกว่า 20 ดูdata.iana.org/TLD/tlds-alpha-by-domain.txt
Jeroenv3

41

ฉันจะใช้ปลั๊กอินตรวจสอบ jQueryด้วยเหตุผลบางประการ

คุณตรวจสอบแล้วตกลงดีตอนนี้อะไร คุณต้องแสดงข้อผิดพลาดจัดการลบมันเมื่อมันถูกต้องแสดงจำนวนข้อผิดพลาดทั้งหมดอาจ? มีหลายสิ่งที่สามารถจัดการกับคุณได้โดยไม่ต้องคิดค้นล้อใหม่

นอกจากนี้ยังมีประโยชน์มากมายอีกอย่างคือมันถูกโฮสต์ไว้ใน CDN เวอร์ชันปัจจุบันณ เวลาที่คำตอบนี้อยู่ที่นี่: http://www.asp.net/ajaxLibrary/CDNjQueryValidate16.ashx นี่หมายถึงเวลาโหลดเร็วขึ้นสำหรับลูกค้า


6
ตกลง ... ไม่จำเป็นต้องบูรณาการล้อ แต่ทำไมฉันต้องติดตั้ง Javyte of Javascript หลายสิบตัวเพื่อตรวจสอบความถูกต้องของเขตข้อมูล มันก็เหมือนกับการสร้างโรงงานรถถ้าสิ่งที่คุณต้องเป็นล้อใหม่ :)
kraftb

3
@ kraftb ตามที่ระบุไว้ในคำตอบของฉันมันคือการจัดการและแสดงการตรวจสอบความถูกต้องไม่ใช่แค่การตรวจสอบความถูกต้องของข้อความ
Nick Craver

5
ขอบคุณสำหรับ @NickCraver:นี่เป็นวิธีการ "ปฏิบัติที่ดีที่สุด" สำหรับปัญหาการจัดการการตรวจสอบอีเมล แน่นอนที่สุดนี้ไม่เหมือนกับการสร้างโรงงาน (เขียน libs เพื่อทำงานทั้งหมด) เพื่อให้ได้ล้อ มันเหมือนทำตามคำแนะนำจากโรงงานเพื่อติดตั้งล้อบนยานพาหนะที่ทันสมัย ​​(แจ็ครถขึ้นวางล้อ - ใส่ถั่วดึง) แทนที่จะพยายามหาวิธีที่จะได้ล้อเกวียนบนรถของคุณ ปลั๊กอินนี้ใช้งานง่ายสุด ๆ ในการตรวจสอบความถูกต้องของแบบฟอร์มการรวมคำอธิบายประกอบและการเรียกใช้เมธอดเดียว
jfgrissom

3
ตอนนี้คุณกำลังสร้างการอุปมาอุปมัยใหม่
Dom Vinyard

สำหรับคนที่ติดทำงานกับ webforms apps encosia.com/using-jquery-validation-with-asp-net-webforms
Jerreck

38

ดูhttp: //bassistance.de/jquery-plugins/jquery-plugin-validation/ มันเป็นปลั๊กอิน jQuery ที่ดีซึ่งอนุญาตให้สร้างระบบการตรวจสอบที่มีประสิทธิภาพสำหรับฟอร์ม มีตัวอย่างที่มีประโยชน์มากมายที่นี่ ดังนั้นการตรวจสอบความถูกต้องของฟิลด์อีเมลจะเป็นดังนี้:

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

ดูเอกสารวิธีการอีเมลสำหรับรายละเอียดและตัวอย่าง


1
คนสุดท้ายยังมีชีวิตอยู่)
Andrew Bashtannik

6
แต่รูปแบบที่ยอมรับได้x@x( นั้นแปลก) มันจะต้องx@x.xแก้ไขได้อย่างไร?
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


ที่มา: htmldrive.com


14

ฉันจะแนะนำVerimail.jsก็ยังมีปลั๊กอิน JQuery

ทำไม? Verimail รองรับสิ่งต่อไปนี้:

  • การตรวจสอบความถูกต้องของไวยากรณ์ (ตาม RFC 822)
  • การตรวจสอบ IANA TLD
  • ข้อเสนอแนะการสะกดสำหรับ TLD และโดเมนอีเมลทั่วไป
  • ปฏิเสธโดเมนบัญชีอีเมลชั่วคราวเช่น mailinator.com

นอกจากการตรวจสอบแล้ว Verimail.js ยังให้คำแนะนำแก่คุณ ดังนั้นหากคุณพิมพ์อีเมลด้วย TLD หรือโดเมนที่ไม่ถูกต้องซึ่งคล้ายกับโดเมนอีเมลทั่วไป (hotmail.com, gmail.com ฯลฯ ) ก็สามารถตรวจจับสิ่งนี้และแนะนำการแก้ไขได้

ตัวอย่าง:

  • test@gnail.con -> คุณหมายถึง test @ gmail.comหรือไม่
  • test@hey.nwt -> คุณหมายถึง test @ hey หรือเปล่า สุทธิ ?
  • test@hottmail.com -> คุณหมายถึง test @ hotmail.comหรือเปล่า

และอื่น ๆ ..

หากต้องการใช้กับ jQuery เพียงแค่รวมverimail.jquery.jsบนเว็บไซต์ของคุณและเรียกใช้ฟังก์ชันด้านล่าง:

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

องค์ประกอบข้อความเป็นองค์ประกอบที่ข้อความจะปรากฏขึ้น นี่อาจเป็นทุกอย่างจาก "อีเมลของคุณไม่ถูกต้อง" ถึง "คุณหมายถึง ... ?"

หากคุณมีแบบฟอร์มและต้องการ จำกัด ไม่ให้ส่งเว้นแต่ว่าอีเมลนั้นถูกต้องคุณสามารถตรวจสอบสถานะได้โดยใช้ getVerimailStatus-function ดังแสดงด้านล่าง:

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

ฟังก์ชันนี้ส่งคืนรหัสสถานะจำนวนเต็มตามวัตถุ Comfirm.AlphaMail.Verimail.Status แต่กฎทั่วไปง่ายๆก็คือรหัสใด ๆ ที่ต่ำกว่า 0 คือรหัสที่ระบุข้อผิดพลาด


.getVerimailStatus()ไม่ได้กลับรหัสสถานะที่เป็นตัวเลขเพียงค่าสตริงของsuccess, errorหรืออาจจะpending(ไม่ได้ตรวจสอบคนสุดท้าย)
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) */ }

นี้จัดทำโดยผู้ใช้Luca Filosofiในคำตอบนี้คำตอบนี้


หากคุณใช้สิ่งนี้ในหน้า ASP.NET MVC มีดโกนอย่าลืมที่จะหลีกเลี่ยง@ตัวละครด้วย@ตัวละครอื่น เช่นนั้น@@มิฉะนั้นคุณจะได้รับข้อผิดพลาดในการสร้าง
Rosdi Kasim


10

นี่เป็นการตรวจสอบที่ละเอียดยิ่งขึ้นตัวอย่างเช่นตรวจสอบกับจุดต่อเนื่องในชื่อผู้ใช้เช่น 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);
}

ดูที่อยู่อีเมลตรวจสอบโดยใช้การแสดงออกปกติใน JavaScript


1
แต่จุดต่อเนื่องนั้นใช้ไม่ได้จริงหรือ ในทางกลับกันฉันคิดว่าคุณจะยกเว้นที่อยู่อีเมลที่ถูกต้องด้วยการทำเช่นนั้น
icktoofay

9

ตามที่คนอื่นพูดถึงคุณสามารถใช้ regex เพื่อตรวจสอบว่าที่อยู่อีเมลตรงกับรูปแบบ แต่คุณยังสามารถมีอีเมลที่ตรงกับรูปแบบ แต่ฉันยังคงตีกลับหรือเป็นอีเมลขยะปลอม

ตรวจสอบด้วย regex

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

การตรวจสอบด้วย API การตรวจสอบอีเมลจริง

คุณสามารถใช้ API ซึ่งจะตรวจสอบว่าที่อยู่อีเมลเป็นจริงและใช้งานอยู่ในปัจจุบัน

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

สำหรับข้อมูลเพิ่มเติมโปรดดูhttps://isitarealemail.comหรือบล็อกโพสต์


8

หากคุณมีรูปแบบพื้นฐานเพียงทำประเภทการป้อนอีเมล: <input type="email" required>

สิ่งนี้จะใช้ได้กับเบราว์เซอร์ที่ใช้คุณลักษณะ HTML5 และคุณไม่จำเป็นต้องมี JS เพียงแค่ใช้การตรวจสอบอีเมลแม้กับสคริปต์บางอย่างด้านบนจะไม่ทำอะไรมากตั้งแต่:

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

ฯลฯ ... ทั้งหมดจะตรวจสอบว่าเป็นอีเมล "ของจริง" ดังนั้นคุณจะดีกว่าเพื่อให้แน่ใจว่าผู้ใช้จะต้องป้อนที่อยู่อีเมลของพวกเขาสองครั้งเพื่อให้แน่ใจว่าพวกเขาใส่ที่อยู่เดียวกัน แต่เพื่อรับประกันว่าที่อยู่อีเมลจริงจะยากมาก แต่น่าสนใจมากที่จะดูว่ามี ทาง แต่ถ้าคุณเพียงแค่ทำให้แน่ใจว่าเป็นอีเมลให้ไปที่อินพุต HTML5

ตัวอย่าง FIDDLE

ใช้งานได้กับ FireFox และ Chrome มันอาจไม่ทำงานใน Internet Explorer ... แต่ผู้สำรวจอินเทอร์เน็ตก็เข้ามา ดังนั้นจึงมี ...


วิธีการ regexp มักจะป้องกันอีเมลที่โง่อย่างชัดเจนเช่น @ bc (ซึ่งตัวอย่าง JSFiddle ที่เชื่อมโยงของคุณอนุญาตให้ใช้ Chrome ล่าสุด) ดังนั้นโซลูชัน HTML5 จึงเป็นโซลูชันที่ไม่เพียงพออย่างชัดเจน
SnowInferno

เย็น. แล้วการใช้รูปแบบการจับคู่อย่าง HTML5 ควรจะทำอย่างไร? ทำไมคุณไม่ลองทำเช่นนี้ใน chromebook ของคุณ: jsfiddle.net/du676/8
isaac weathers

8

การตรวจสอบอีเมล Javascript ใน MVC / ASP.NET

ปัญหาที่ฉันเจอในขณะที่ใช้คำตอบของเฟเบียนกำลังนำไปใช้ในมุมมอง MVC เนื่องจาก@สัญลักษณ์มีดโกน คุณต้องรวม@สัญลักษณ์เพิ่มเติมเพื่อหลบหนีเช่น:@@

วิธีหลีกเลี่ยงมีดโกนในรูปแบบ MVC

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

ฉันไม่เห็นที่อื่นในหน้านี้ดังนั้นฉันคิดว่าอาจเป็นประโยชน์

แก้ไข

นี่คือลิงค์จาก Microsoft อธิบายการใช้งาน
ฉันเพิ่งทดสอบโค้ดด้านบนและได้ js ต่อไปนี้:

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

ซึ่งกำลังทำสิ่งที่ควรทำ


@nbrogi คุณหมายความว่าอย่างไรมันไม่ทำงาน ฉันเพิ่งตรวจสอบสิ่งนี้อีกครั้งและสิ่งนี้ทำให้ js ต่อไปนี้var regex = /^([a-zA-Z0-9_.+-])+\@(([a-zA-Z0-9-])+\.)+([a-zA-Z0-9]{2,4})+$/; เกิดอะไรขึ้นกับโค้ดของคุณ
Trevor Nestman

ขออภัยฉันไม่แน่ใจในขณะนี้ฉันเปลี่ยนมันอย่างสมบูรณ์
nkkollaw

โปรดแจ้งให้เราทราบเมื่อคุณสามารถ ถ้านี่เป็นข้อมูลที่ไม่ดีแล้วฉันจะเอามันลงไป ฉันพยายามให้ข้อมูลที่เป็นประโยชน์เมื่อเป็นไปได้และสิ่งนี้ช่วยฉันเมื่อเขียน regex ในมุมมอง MVC
Trevor Nestman

อีกครั้งฉันอยากรู้ว่าทำไมสิ่งนี้จึงถูกลดระดับลง มันไม่ตรงกับสิ่งที่ฉันต้องการมันซึ่งเป็นผลิต@สัญลักษณ์ใน regex .cshtmlใน โดยปกติแล้วมันจะพยายามรักษาทุกอย่างหลังจาก@สัญลักษณ์เป็นรหัสมีดโกน แต่สองครั้งที่@@ป้องกันไม่ให้
Trevor Nestman

ปัญหาหลักที่ฉันเห็นคือใน codeblock ที่สอง regex ของคุณถูกตั้งค่าเป็นตัวแปรชื่อ regex แต่บรรทัดที่สองใช้ตัวแปรที่ชื่อว่า 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);
};

ใช้แบบนี้:

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


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

ลงจอดที่นี่ ..... จบลงที่นี่: https://html.spec.whatwg.org/multipage/forms.html#valid-e-mail-address

... ซึ่งให้ 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])?)*$/

... ที่ฉันพบขอบคุณบันทึกในการตรวจสอบปลั๊กอิน jQuery readme: https://github.com/jzaefferer/jquery-validation/blob/master/README.md#reporting-an-issue

ดังนั้นรุ่นล่าสุดของ@Fabian 's คำตอบจะเป็น:

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

หวังว่าจะช่วย


อันนี้เป็นคำตอบที่ดีที่สุดสำหรับฉัน - มันกลับมาจริงjohn..doe@example.comแต่ก็อยากให้มันผิด
Adam Knights

3

ใช้สิ่งนี้

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

ข้อผิดพลาดอยู่ในปลั๊กอินการตรวจสอบความถูกต้องของการตรวจสอบความถูกต้อง Jquery ตรวจสอบกับ @ เพื่อเปลี่ยนสิ่งนี้เท่านั้น

เปลี่ยนรหัสเป็นสิ่งนี้

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

สำหรับผู้ที่ต้องการใช้การบำรุงรักษาที่ดีขึ้นกว่าการแข่งขัน RegEx ที่ปัญหาน้อยกว่าในปีที่แล้วฉันเขียนโค้ดขึ้นสองสามบรรทัด ผู้ที่ต้องการบันทึกไบต์ติดกับตัวแปร RegEx :)

ข้อ จำกัด นี้:

  • ไม่มี @ ในสตริง
  • ไม่มีจุดในสตริง
  • มากกว่า 2 จุดหลังจาก @
  • ตัวอักษรไม่ดีในชื่อผู้ใช้ (ก่อน @)
  • มากกว่า 2 @ ในสตริง
  • ตัวอักษรไม่ดีในโดเมน
  • ตัวอักษรไม่ดีในโดเมนย่อย
  • ตัวอักษรไม่ดีใน TLD
  • TLD - ที่อยู่

อย่างไรก็ตามมันยังคงเป็นไปได้ที่จะรั่วไหลดังนั้นโปรดตรวจสอบให้แน่ใจว่าคุณรวมสิ่งนี้กับการตรวจสอบความถูกต้องฝั่งเซิร์ฟเวอร์ + การตรวจสอบอีเมลลิงค์

นี่คือ 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

คุณสามารถใช้การตรวจสอบ jQueryและในบรรทัด HTML เดียวคุณสามารถตรวจสอบอีเมลและข้อความการตรวจสอบอีเมล:type="email" required data-msg-email="Enter a valid email account!"

คุณสามารถใช้พารามิเตอร์data-msg-emailเพื่อวางข้อความส่วนตัวหรือไม่ควรวางพารามิเตอร์นี้และข้อความเริ่มต้นจะปรากฏขึ้น: "โปรดป้อนที่อยู่อีเมลที่ถูกต้อง"

ตัวอย่างเต็มรูปแบบ:

<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
คุณช่วยอธิบายคำตอบของคุณได้ไหม ... ตัวอย่างเช่นคุณควรพูดถึงว่า getVerimailStatus เป็นปลั๊กอินเพิ่มเติม
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" );

Refernce: เว็บไซต์ JQUERY UI



2

อีกตัวเลือกที่ง่ายและสมบูรณ์:

<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 เป็นเว็บไซต์ภาษาอังกฤษ กรุณาอย่าโพสต์เนื้อหาในภาษาอื่น
Anders

2

คุณสามารถสร้างฟังก์ชั่นของคุณเอง

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

ตัวย่อที่ฉันเพิ่งสร้างขึ้นทำในสิ่งที่ฉันต้องการ จำกัด ไว้เพียงแค่ตัวอักษรและตัวเลขเครื่องหมายขีดเส้นใต้และ @

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

ทำด้วยความช่วยเหลือจากผู้อื่น


1

regexp นี้ป้องกันชื่อโดเมนซ้ำเช่น abc@abc.com.com.com ซึ่งจะอนุญาตให้ใช้โดเมนเพียงสองครั้งเช่น abc@abc.co.in นอกจากนี้ยังไม่อนุญาตให้ใช้รูปปั้นจากหมายเลขเช่น 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)?$/, 

ทั้งหมดที่ดีที่สุด !!!!!


1

ตรวจสอบอีเมลขณะพิมพ์ด้วยการจัดการสถานะปุ่ม

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

หากคุณกำลังใช้ การตรวจสอบ jquery

ฉันสร้างวิธีการemailCustomFormatที่ใช้ regexสำหรับรูปแบบ custm ของฉันคุณสามารถเปลี่ยนให้เป็นไปตามข้อกำหนดของคุณ

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

จากนั้นคุณสามารถใช้มันเช่นนี้

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

regex นี้ยอมรับ

abc@abc.abc, abc@abc.abcd แต่ไม่นี้

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

หวังว่านี่จะช่วยคุณได้

โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.