checkbox ติ๊กแล้วเรียกใช้ฟังก์ชัน JavaScript

checkbox ติ๊กแล้วเรียกใช้ฟังก์ชัน JavaScript บทความนี้สอนใช้คำสั่ง onclick กับ input type checkbox เพื่อดักจับเหตุการณ์ผู้ใช้งานติ๊กเลือก ไม่ติ๊กเลือก checkbox พร้อมแสดงผลลัพธ์ด้วย console.log สามารถเขียนโปรแกรมได้ดังนี้

ตัวอย่าง checkbox ติ๊กแล้วเรียกใช้ฟังก์ชัน JavaScript

<input type="checkbox" value="red" id="chk" onclick="myCheckBox()"> กรุณาเลือก Checkbox

<script>
    function myCheckBox() {
        var chk = document.getElementById("chk");
        if( chk.checked ) {
            console.log("คุณเลือก checkbox");
        } else {
            console.log("คุณไม่ได้เลือก checkbox");
        }
    }
</script>

ผลลัพธ์

คุณเลือก checkbox
คุณไม่ได้เลือก checkbox

จากตัวอย่างสร้าง checkbox และกำหนด id = chk เมื่อผู้ใช้งานติ๊กเปลี่ยนค่าที่ checkbox โปรแกรมจะทำงานในฟังก์ชัน myCheckBox โดยการเข้าถึงฟังก์ชันดังกล่าวผ่าน attribute id และใช้คำสั่ง checked ร่วมกับ if else กรณีถ้าผู้ใช้งานติ๊กเลือก checkbox โปรแกรมจะทำงานในเงื่อนไข if กลับกันถ้าติ๊ก checkbox ออกโปรแกรมจะทำงานในเงื่อนไข else แทน ภาษา JavaScript