วิธีการจัดรูปแบบเลขบัตรประชาชนที่กรอกอัตโนมัติ

Jquery & Ajax Knowledge ความรู้เกี่ยวกับ Javascript , Jquery ม Ajax

Moderators: mindphp, ผู้ดูแลกระดาน

User avatar
Ittichai_chupol
PHP VIP Members
PHP VIP Members
Posts: 5277
Joined: 19/09/2018 10:33 am

วิธีการจัดรูปแบบเลขบัตรประชาชนที่กรอกอัตโนมัติ

Post by Ittichai_chupol »

การสมัครเข้าใช้งานเว็บไซต์หรือระบบ ต่างๆ ที่มีส่วนเกี่ยวข้องการทางการเงินนั้นส่วนใหญ่จะต้องมีการยืนยันข้อมูลตัวตนของผู้ใช้งานคนนนั้นๆเสมอ เพื่อป้องกันการฉ้อโกงหรือ การกระทำความผิดทางกฏหมาย หรือ การทุจริตต่างๆ โดยทั้งนี้การส่วนที่เป็นสิ่งสำคัญและถือว่าว่าเป็นข้อมูลที่จำเป็นต่อการยืนยันตัวตนนั้นเป็นอย่างมากเลยก็คือ ข้อมูลเลขบัตรประชน โดยทั้งนี้เพื่อเป็นการอำนวยความสะดวกและเพิ่มความส่วนงามให้กับการกรอกข้อมูล ในบางครั้งก็จะมีการจัดรูปแบบตัวเลขในเป็นรูปแบบเดียวกับบัตรประชน โดยการใช้ html เป็นส่วนสำหรับสร้างช่องกรอกค่า และใช่ javascript สำหรับจัดการรูปแบบอยู่เบื่อง ทั้งตัวอย่าง code นี้

Code: Select all


<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script>
function autoTab(obj) {
    var pattern = new String("_-____-_____-_-__"); // กำหนดรูปแบบในนี้
    var pattern_ex = new String("-"); // กำหนดสัญลักษณ์หรือเครื่องหมายที่ใช้แบ่งในนี้
    var returnText = new String("");
    var obj_l = obj.value.length;
    var obj_l2 = obj_l - 1;
    for (i = 0; i < pattern.length; i++) {
        if (obj_l2 == i && pattern.charAt(i + 1) == pattern_ex) {
            returnText += obj.value + pattern_ex;
            obj.value = returnText;
        }
    }
    if (obj_l >= pattern.length) {
        obj.value = obj.value.substr(0, pattern.length);
    }
}

</script>
</head>
<body>
<p>Demonstrate fadeIn() with different parameters.</p>

        <input type="text" tabindex="1"  placeholder="x-xxxxx-xxxxx-xx-x"   name="reg_id_card" id="username" size="25" value="" class="inputbox autowidth"  onkeyup="autoTab(this)"  minlength="13" maxlength="20" />

</body>
</html>


ตัวอย่างผลการใช้งาน
ezgif.com-video-to-gif.gif
ezgif.com-video-to-gif.gif (270.28 KiB) Viewed 213 times


บทความเพิ่มเติม

วิธีการเขียน php สำหรับตรวจสอบหมายเลขบัตรประชาชนว่ามีความถูกต้องหรือไม่
การสร้าง Extension ใน phpbb
การสร้าง controller สำหรับ phpbb
私を傷つけるすべてが終了します。

Return to “Jquery & Ajax Knowledge”

Who is online

Users browsing this forum: No registered users and 3 guests