เมื่อคุณมีแบบฟอร์ม HTML และใช้งานได้คุณมักต้องการตรวจสอบให้แน่ใจว่าได้กรอกข้อมูลในฟิลด์ที่สำคัญทั้งหมดตัวอย่างเช่นหากคุณต้องการส่งจดหมายยืนยันทางอีเมลระบบจะรวมที่อยู่อีเมลไว้ในฟิลด์ฟอร์ม และควรเป็นที่อยู่อีเมลที่ใช้งานได้
มีสองวิธีในการตรวจสอบความถูกต้องของฟอร์มของคุณ:
- ใช้ JavaScript
- การใช้ สคริปต์ CGI
ข้อดีของการใช้ JavaScript สำหรับการตรวจสอบความถูกต้องของฟอร์ม
- การใช้จาวาสคริปต์คุณไม่ได้ใช้เวลาประมวลผลของเซิร์ฟเวอร์ใด ๆ การประมวลผลทั้งหมดจะกระทำบนคอมพิวเตอร์ไคลเอ็นต์
- ดูเหมือนว่าจะทำงานได้เร็วกว่าการตรวจสอบ CGI
- เนื่องจากหน้าฟอร์มไม่ได้เปลี่ยนผู้อ่านจึงสามารถแก้ไขข้อผิดพลาดได้ง่าย
ข้อเสียของการใช้ JavaScript สำหรับการตรวจสอบความถูกต้องของฟอร์ม
- JavaScript ใช้ได้กับเบราว์เซอร์ที่เปิดใช้งานเท่านั้น หากปิดใช้งาน JavaScript การตรวจสอบข้อผิดพลาดของคุณจะไม่ได้รับการแก้ไข
ข้อดีของการใช้ CGI สำหรับการตรวจสอบฟอร์ม
- การใช้ CGI เพื่อตรวจสอบความถูกต้องจะทำให้ทุกครั้งที่มีการส่งแบบฟอร์มการตรวจสอบจะทำงาน
ข้อเสียของการใช้ CGI สำหรับการตรวจสอบฟอร์ม
- CGI ทำให้โหลดมากกว่าบนเว็บเซิร์ฟเวอร์และทุกฟังก์ชันที่รวมอยู่ใน CGI เป็นอีกหนึ่งภารกิจสำหรับเซิร์ฟเวอร์
- CGI สามารถทำงานได้ช้า
- หากมีข้อผิดพลาดลูกค้าต้องกลับไปที่หน้าแรกของฟอร์มหรือ CGI ต้องการฟังก์ชันอื่นเพื่อเขียนหน้าฟอร์มใหม่
วิธีที่ฉันจัดการนี้คือการมีส่วนใหญ่ของการตรวจสอบข้อผิดพลาดที่ทำกับ JavaScript ด้วยวิธีนี้ผู้อ่านจะได้รับความรวดเร็วและง่ายดาย
ฉันจึงตรวจสอบองค์ประกอบสำคัญของฟอร์มด้วย CGI
วิธีใช้ JavaScript เพื่อตรวจสอบความถูกต้องของฟอร์ม HTML
พื้นฐานของการสร้างการตรวจสอบความถูกต้องของฟอร์มคือการมองหาชื่อของ องค์ประกอบ ของ ฟอร์ม ที่จำเป็นและหากว่างเปล่าแสดงข้อความแสดงข้อผิดพลาด
โปรแกรมตรวจสอบข้อผิดพลาดส่วนใหญ่ตรวจสอบแต่ละฟิลด์ทีละหนึ่งครั้งและแสดงข้อผิดพลาดทีละครั้ง
ซึ่งจะทำให้การกรอกแบบฟอร์มน่าเบื่อและคนอาจหยุดอยู่ตรงกลาง หากคุณใช้สคริปต์ต่อไปนี้และแหล่งข้อมูล Perl คุณจะทราบวิธีตรวจสอบทั้งรูปแบบพร้อมกันแสดงชุดข้อความแสดงข้อผิดพลาดที่ผู้อ่านของคุณสามารถกลับไปแก้ไขได้
JavaScript สำหรับการตรวจสอบความถูกต้องของแบบฟอร์ม
ในส่วนหัวของ HTML คุณควรสร้างสคริปต์เพื่อทำแบบฟอร์มการตรวจสอบความถูกต้อง:
- ตั้งค่าสคริปต์และตรวจสอบว่ามีการซ่อนจากเบราว์เซอร์ที่ไม่สามารถจัดการ JavaScript ได้