ตรวจสอบที่อยู่อีเมลด้วย JavaScript และนิพจน์ทั่วไป

เมื่อสักครู่ที่ผ่านมาฉันวาง ตัวตรวจสอบความแข็งแรงของรหัสผ่านโดยใช้ JavaScript และนิพจน์ทั่วไป. ในบันทึกเดียวกันนี้คุณยังสามารถตรวจสอบโครงสร้างของที่อยู่อีเมลโดยใช้วิธีการนิพจน์ทั่วไป (regex) เดียวกันได้

หากองค์ประกอบแบบฟอร์มของคุณมี id =” ที่อยู่อีเมล” และคุณเพิ่มแบบฟอร์ม onSubmit =” return checkEmail ();“ นี่คือฟังก์ชัน Javascript ที่คุณสามารถใช้เพื่อส่งคืนการแจ้งเตือนว่าที่อยู่อีเมลมีโครงสร้างที่ถูกต้องหรือไม่:

function checkEmail() {
var email = document.getElementById('emailaddress');
var filter = /^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
if (!filter.test(email.value)) {
alert('Please provide a valid email address');
email.focus;
return false;
}
}

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

41 คอมเมนต์

  1. 1

    สำหรับแบบฟอร์มที่มีที่อยู่อีเมลหลายรายการควรทำ class =” emailaddress” หากคุณมีไลบรารีต้นแบบ.js (http://www.prototypejs.org) รวมอยู่ในหน้าคุณสามารถทำสิ่งนี้:

    var ถูกต้อง = จริง;
    var filter = /^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/;
    $$ ('. emailaddress'). each (function (email) {
    ถ้า (! filter.test (email.value)) {
    การแจ้งเตือน (? โปรดระบุที่อยู่อีเมลที่ถูกต้อง?);
    email.focus;
    ถูกต้อง = เท็จ;
    }
    });
    กลับถูกต้อง;

  2. 5
  3. 7

    ฉันชอบแนวคิดนี้ แต่ฉันลังเลที่จะใช้นิพจน์ทั่วไปนี้โดยไม่มีคำอธิบายว่าที่อยู่อีเมลทางกฎหมายใดที่ไม่ยอมรับและที่อยู่ที่ผิดกฎหมายที่อนุญาต

    สำหรับตัวอย่างของนิพจน์ทั่วไปที่ทำงานได้ดีควบคู่ไปกับคำอธิบายว่ากรณีใดไม่ครอบคลุมโปรดดูสิ่งนี้:

    http://www.regular-expressions.info/email.html

    ความชอบส่วนตัวของฉันคือครอบคลุมกรณีง่าย ๆ ส่วนใหญ่และออกคำเตือนสำหรับสิ่งอื่น ๆ แทนที่จะปฏิเสธ ถ้าบ๊อบต้องการที่จะส่ง bob@com.museum มากกว่า bob@museum.comทำไมไม่ปล่อยให้เขา?

    • 8

      สวัสดี Reg

      คุณสามารถทดสอบ Regex โดยใช้ไฟล์ เครื่องทดสอบ Regex ออนไลน์.

      นอกจากนี้ยังมีอีกมากมายที่สามารถทำได้หากคุณต้องการให้แน่ใจว่าไฟล์ ที่อยู่อีเมล์ ถูกต้องตาม RFC

      มีสาเหตุบางประการที่ไม่อนุญาตให้บุคคลอื่นป้อนที่อยู่อีเมลที่ไม่ถูกต้อง:
      1. พวกเขาจะรำคาญคุณเมื่ออีเมลที่พวกเขาคาดไว้ไม่ผ่าน - ไม่ว่าคุณจะป้อนที่อยู่ผิดหรือไม่ก็ตาม
      2. หาก com.museum เป็นโดเมนที่ถูกต้องและสมมติว่า Yahoo! ดำเนินการ - ที่อยู่อีเมลใด ๆ ที่ตีกลับจะส่งผลเสียต่อชื่อเสียงของ บริษัท ของคุณในการส่งอีเมล ซึ่งอาจทำให้อีเมลทั้งหมดของ บริษัท ของคุณถูกบล็อก
      3. หากผู้ให้บริการอีเมลของคุณอนุญาตให้คุณป้อน bob@com.museumคุณจะต้องชำระเงินสำหรับอีเมลแต่ละฉบับที่ส่งไปยังที่อยู่อีเมลนั้นจนกว่าจะยกเลิกการสมัครที่อยู่นั้นเนื่องจากการตีกลับ ฉันจะหลีกเลี่ยง ESP ใด ๆ ที่อนุญาตให้มีที่อยู่อีเมลที่ไม่ถูกต้องเช่นนั้น - พวกเขากำลังรับเงินของคุณเท่านั้น!

      ขอบคุณที่หยุดโดย!
      ดั๊ก

  4. 9
  5. 10

    มีวิธีที่ง่ายกว่ามากในการเขียนนิพจน์:
    var regex = /^[a-z0-9\._-]+@([a-z0-9_-]+\.)+[a-z]{2,6}$/i;
    - ด้วยตัวปรับแต่งขั้นสุดท้าย / ฉันไม่จำเป็นต้องระบุช่วงตัวพิมพ์ใหญ่
    - ไม่รู้เรื่องใด ๆ TLD มีตัวเลขอยู่ในนั้น
    หมายเหตุด้านข้างฉันอนุญาต TLD ที่มีตัวอักษรมากถึง 6 ตัว; คนใหม่มาถึงเป็นประจำและคุณไม่มีทางรู้ (ฉันรู้ว่าอนาคตอาจมีตัวเลขอยู่ด้วยซ้ำ)

  6. 11

    สวัสดี,

    ฉันต้องการใช้สิ่งนี้ในรูปแบบที่มีอยู่ในแบบเรียลไทม์ แต่ดูเหมือนว่าจะไม่ได้รับการตรวจสอบแบบเรียลไทม์เช่นตัวตรวจสอบความปลอดภัยของรหัสผ่านของคุณ ...

    หรือฉันเป็นคนไร้เดียงสาและมันก็ไม่เวิร์คสำหรับฉัน?

  7. 12

    ฉันชอบสิ่งที่คุณทำที่นี่มากบทช่วยสอนของคุณนั้นเรียบง่ายมากฉันจะคั่นหน้านี้ไว้อย่างแน่นอน….

  8. 13

    แค่ FYI; ฉันไม่ได้ลองวิธีแก้ปัญหาของ Ade แต่รูปแบบด้านบนไม่ได้ตรวจสอบที่อยู่อีเมลที่มีเครื่องหมายอะพอสทรอฟีอยู่ในนั้น .. (เช่น Mike.O'Hare@Whatever.com) Apostrophes ถูกต้องตาม RFC 2821/2822 -> http://www.faqs.org/rfcs/rfc2822.html

    เอชทีเอช
    แซนเจย์

  9. 16
  10. 17

    การแก้ไขเพียงเล็กน้อย: นิพจน์ทั่วไปมีเครื่องหมายพิเศษ () + ต่อท้าย ควรอ่าน:

    ^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+[a-zA-Z0-9]{2,4}$

    โดยข้อแรกจะยอมรับ TLDs ที่มีความยาว (ซึ่งไม่ผิดภายในอย่างที่คนอื่นชี้ให้เห็น แต่หากเป็นความตั้งใจก็สามารถย่อนิพจน์ได้)

  11. 18

    คุณช่วยอธิบายนิพจน์ทั่วไปของรหัสนี้และวิธีการทำงานได้หรือไม่ เกี่ยวกับ. test -. test เป็นคำสั่งเริ่มต้นใน javascript เพื่อตรวจสอบสิ่งต่างๆเช่นเดียวกับที่คุณทำในโค้ดด้านบนหรือไม่

  12. 19
  13. 20

    นี่เป็นรหัสสั้น ๆ สำหรับนิพจน์อีเมล -

    ฟังก์ชัน validateEmail (id)
    {
    var emailPattern = /^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+.[a-zA-Z]{2,4}$/
    ส่งกลับ emailPattern.test (id);

    }
    ดีภักดิ์เชียงราย
    พารา ณ สี

  14. 21
  15. 22
  16. 23

    ขอบคุณ แต่มีข้อผิดพลาดใน regex นี้ ฉันไม่ใช่ผู้เชี่ยวชาญ regex แต่ฉันลองใช้อีเมล:

    test @ test

    และมันผ่าน regex …ฉันสังเกตว่ามันขาดการหลบหนี "." ดังนั้นควรเป็น:

    /^([a-zA-Z0-9_.-])+@(([a-zA-Z0-9-])+.)+([a-zA-Z0-9]{2,4})+$/

  17. 24
  18. 27

    นี่เป็นเพียงการตรวจสอบคร่าวๆ แต่ไม่ถูกต้อง 100% เช่นจะใช้ได้ john_doe. @ gmail.com ซึ่งจริงๆแล้วไม่ใช่ที่อยู่อีเมลที่ถูกต้อง (ไม่อนุญาตให้ใช้จุดเป็นอักขระสุดท้ายในส่วนท้องถิ่นของอีเมล)
    นอกจากนี้ยังจะยอมรับ john…doe@gmail.com ซึ่งไม่ถูกต้องเช่นกันเนื่องจากไม่สามารถมีจุดมากกว่าหนึ่งจุดในลำดับ

    นี่เป็นเพียงข้อบกพร่องบางประการที่ฉันสังเกตเห็นตั้งแต่แรกเห็น
    ความตั้งใจของฉันไม่ได้เป็นการทุบตีเพียงเพื่อชี้ให้เห็นสิ่งนี้ในกรณีที่มีคนวางแผนที่จะใช้สิ่งนี้เป็นการตรวจสอบความปลอดภัย - ไม่ปลอดภัยเพียงพอ

    สำหรับข้อมูลเกี่ยวกับที่อยู่อีเมลที่ถูกต้องโปรดดูที่: http://en.wikipedia.org/wiki/E-mail_address

  19. 28

    ดีพัค

    อันที่จริงฉันคิดว่าคุณต้องใช้การหลีกเลี่ยงสำหรับจุด (“.”) ดังนั้นหน้าที่ของคุณควรเป็นแทน:

    ฟังก์ชัน validateEmail (id)
    {
    var emailPattern = /^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+.[a-zA-Z]{2,4}$/
    ส่งกลับ emailPattern.test (id);

    }

    มิฉะนั้นจุดจะหมายถึง "อักขระใด ๆ " ฉันเชื่อว่าอักขระพิเศษดังกล่าวจำเป็นต้องถูกหลบหนี

    ความนับถือ,

    Federico

  20. 29

    ฟังก์ชัน validateEmail (fld) {
    var error =””;
    var tfld = ตัดแต่ง (fld.value); // ค่าของฟิลด์ที่มีการตัดช่องว่าง
    var emailFilter = /^[^@]+@[^@.]+.[^@]*ww$/;
    var ผิดกฏหมาย = / [(),;: \” []] /;

    if (fld.value ==“ ป้อนที่อยู่อีเมลของคุณ”) {

    ข้อผิดพลาด =“ กรุณาป้อนที่อยู่อีเมลของคุณ n”;
    } else if (! emailFilter.test (tfld)) {// ทดสอบอีเมลสำหรับอักขระที่ผิดกฎหมาย

    error =“ กรุณากรอกที่อยู่อีเมลที่ถูกต้อง n”;
    } else if (fld.value.match (WrongChars)) {

    error =“ กรุณากรอกที่อยู่อีเมลที่ถูกต้อง n”;
    }
    กลับข้อผิดพลาด;
    }

  21. 30

    ฟังก์ชัน validateEmail (fld) {
    var error =””;
    var tfld = ตัดแต่ง (fld.value); // ค่าของฟิลด์ที่มีการตัดช่องว่าง
    var emailFilter = /^[^@]+@[^@.]+.[^@]*ww$/;
    var ผิดกฏหมาย = / [(),;: \” []] /;

    if (fld.value ==“ ป้อนที่อยู่อีเมลของคุณ”) {

    ข้อผิดพลาด =“ กรุณาป้อนที่อยู่อีเมลของคุณ n”;
    } else if (! emailFilter.test (tfld)) {// ทดสอบอีเมลสำหรับอักขระที่ผิดกฎหมาย

    error =“ กรุณากรอกที่อยู่อีเมลที่ถูกต้อง n”;
    } else if (fld.value.match (WrongChars)) {

    error =“ กรุณากรอกที่อยู่อีเมลที่ถูกต้อง n”;
    }
    กลับข้อผิดพลาด;
    }

  22. 31

    ฟังก์ชัน validateEmail (fld) {
    var error =””;
    var tfld = ตัดแต่ง (fld.value); // ค่าของฟิลด์ที่มีการตัดช่องว่าง
    var emailFilter = /^[^@]+@[^@.]+.[^@]*ww$/;
    var ผิดกฏหมาย = / [(),;: \” []] /;

    if (fld.value ==“ ป้อนที่อยู่อีเมลของคุณ”) {

    ข้อผิดพลาด =“ กรุณาป้อนที่อยู่อีเมลของคุณ n”;
    } else if (! emailFilter.test (tfld)) {// ทดสอบอีเมลสำหรับอักขระที่ผิดกฎหมาย

    error =“ กรุณากรอกที่อยู่อีเมลที่ถูกต้อง n”;
    } else if (fld.value.match (WrongChars)) {

    error =“ กรุณากรอกที่อยู่อีเมลที่ถูกต้อง n”;
    }
    กลับข้อผิดพลาด;
    }

  23. 32

    ฟังก์ชัน validateEmail (fld) {
    var error =””;
    var tfld = ตัดแต่ง (fld.value); // ค่าของฟิลด์ที่มีการตัดช่องว่าง
    var emailFilter = /^[^@]+@[^@.]+.[^@]*ww$/;
    var ผิดกฏหมาย = / [(),;: \” []] /;

    if (fld.value ==“ ป้อนที่อยู่อีเมลของคุณ”) {

    ข้อผิดพลาด =“ กรุณาป้อนที่อยู่อีเมลของคุณ n”;
    } else if (! emailFilter.test (tfld)) {// ทดสอบอีเมลสำหรับอักขระที่ผิดกฎหมาย

    error =“ กรุณากรอกที่อยู่อีเมลที่ถูกต้อง n”;
    } else if (fld.value.match (WrongChars)) {

    error =“ กรุณากรอกที่อยู่อีเมลที่ถูกต้อง n”;
    }
    กลับข้อผิดพลาด;
    }

  24. 33
  25. 34
  26. 35
  27. 36
  28. 37
  29. 38
  30. 39
  31. 40

คุณคิดอย่างไร?

ไซต์นี้ใช้ Akismet เพื่อลดสแปม เรียนรู้วิธีการประมวลผลข้อมูลความคิดเห็นของคุณ.