jQuery คํานวณอายุ จากปีเกิดของผู้ใช้งาน

jQuery คํานวณอายุ จากปีเกิดของผู้ใช้งาน บทความนี้สอนเขียนโปรแกรมรับค่าปีเกิดของผู้ใช้งาน และนำมาคำนวณหาอายุพร้อมแสดงผลลัพธ์ที่หน้าเว็บไซต์ โดยใช้ jQuery Framework สามารถเขียนโปรแกรมได้ดังนี้

ตัวอย่าง jQuery คํานวณอายุ จากปีเกิดของผู้ใช้งาน

กรุณากรอกปีเกิด พ.ศ. <input type="number" id="bd_year">
<input type="button" value="คำนวณอายุ" id="ok">
<div id="result" style="margin-top:.5rem"></div>

<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
<script>
    $(document).ready(function(){
        $("#ok").click(function(){
            let bd_year = $("#bd_year").val();
            if( parseInt(bd_year) > 0 ) {
                let now_year = ( parseInt( new Date().getFullYear() ) + 543 );
                let age = parseInt( now_year - bd_year );
                $("#result").html( "คุณเกิดปี "+bd_year+" ปัจจุบันคุณอายุ "+age+" ปี" );
            }
        });
    });
</script>

ผลลัพธ์

คุณเกิดปี 2531 ปัจจุบันคุณอายุ 34 ปี

jQuery คํานวณอายุ จากปีเกิดของผู้ใช้งาน มีรายละเอียดการเขียนโปรแกรมดังนี้

1. สร้าง input text และปุ่มกด button ของ HTML เพื่อรับปีเกิดของผู้ใช้งาน เมื่อผู้ใช้งานกดปุ่ม button โปรแกรมจะเข้าทำงานในฟังก์ชัน $("#ok").click

2. ดึงปีเกิดของผู้ใช้งาน ด้วยคำสั่ง val เก็บไว้ที่ตัวแปร bd_year ด้วยการอ้างถึง id เท่ากับ bd_year

3. สร้างตัวแปรชื่อ now_year เก็บปีปัจจุบัน โดยใช้คำสั่ง Date().getFullYear() และบวกเพิ่ม 543 เพื่อแปลง ค.ศ. เป็น พ.ศ.

4. นำตัวแปร now_year - bd_year เพื่อหาอายุปัจจุบันเก็บผลลัพธ์ไว้ที่ตัวแปร age

5. แสดงผลลัพธ์ของตัวแปร bd_year และ age ที่หน้าเว็บไซต์ ผ่าน div id เท่ากับ result ด้วยคำสั่ง html