สมาร์ทตรวจสอบเป็น jQuery บัตรเครดิตปลั๊กอินการตรวจสอบที่ทำให้บัตรเครดิตการตรวจสอบรูปแบบเป็นงานที่ง่าย จะตรวจสอบว่าผู้ใช้ที่ถูกต้องได้เข้าบัตรเครดิตจำนวนก่อนการทำธุรกรรมที่เกิดขึ้นจริงสมาร์ทตรวจสอบสนับสนุนบัตรเครดิตต่อไปนี้
- อเมริกันเอ็กซ์เพรส
- มาสเตอร์การ์ด
- บัตรวีซ่า
- ไดเนอร์สคลับ
- ค้นพบ
ปลั๊กอินที่สามารถขยายได้อย่างง่ายดายเพื่อสนับสนุนประเภทบัตรเครดิตอื่น ๆ
การใช้สมาร์ทตรวจสอบ
ในไฟล์ HTML ของคุณเพิ่มต่อไปในส่วนหัว
- เพิ่มการอ้างอิงถึงสคริปต์ jQuery ล่าสุด
- เพิ่มการอ้างอิงไปยังแฟ้ม ccvalidate.js
- เพิ่มการอ้างอิงไปยังแฟ้ม ccvalidate.css
เพิ่มรหัสด้านล่างเพื่อเอกสารหรือการใช้การเรียน "cc-DDL ประเภท", "cc-บัตรจำนวน" และ "cc-เช็คเอาต์" เพื่อองค์ประกอบที่มีอยู่ของคุณ ชั้นเรียนเหล่านี้มีผลบังคับใช้เป็นปลั๊กอินตรวจสอบสมาร์ทใช้ชั้นเรียนเหล่านี้ในการอ่านค่าที่ต้องการ
1
2
3
4
5
6
7
8
9
| <select class="cc-ddl-type"><option value="mcd">Master Card</option><option value="vis">Visa Card</option><option value="amx">American Express</option><option value="dnr">Diner Club</option><option value="dis">Discover</option></select><input class="cc-card-number" type="text"><input class="cc-checkout" type="submit" value="Checkout"> |
ปลั๊กอินตรวจสอบสมาร์ทมีเพียงหนึ่งพารามิเตอร์ที่มีฟังก์ชั่นการโทรกลับจะเรียกว่าที่ส่งกลับค่าบูลีนระบุว่าหมายเลขบัตรเครดิตที่อยู่ในรูปแบบที่ถูกต้องหรือไม่ ดูตัวอย่างด้านล่างเพื่อดูวิธีการทำงาน
1
2
3
4
5
6
| $('.cc-container').ccvalidate({ onvalidate: function(isValid) { if (!isValid) { alert('Incorrect Credit Card format'); return false; } } |
นี่คือรหัสที่เต็มรูปแบบสำหรับตัวอย่างข้างต้น
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
| <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><head> <title>jQuery Credit Card Validation Plugin Sample</title> <script src="jquery-1.4.4.min.js" type="text/javascript"></script> <script src="ccvalidate.js" type="text/javascript"></script> <link href="ccvalidate.css" rel="stylesheet" type="text/css" /> <script type="text/javascript"> $(document).ready(function() { $('.cc-container').ccvalidate({ onvalidate: function(isValid) { if (!isValid) { alert('Incorrect Credit Card format'); return false; } } }); }); </script></head><body> <div class="cc-container"> <select id="cc-types" class="cc-ddl-type"> <option value="mcd">Master Card</option> <option value="vis">Visa Card</option> <option value="amx">American Express</option> <option value="dnr">Diner Club</option> <option value="dis">Discover</option> </select> <input type="text" id="card-number" class="cc-card-number" /> <input type="submit" value="Checkout" class="cc-checkout" id="check-out" /> </div></body></html> |
0 ความคิดเห็น :
แสดงความคิดเห็น