keyup jQuery ตัวอย่าง พร้อมคำอธิบาย

keyup jQuery ตัวอย่าง พร้อมคำอธิบาย บทความนี้สอนการใข้คำสั่ง keyup ของ jQuery ร่วมกับ input type=text หรือ Textbox ของ HTML เพื่อเขียนโปรแกรมดักจับเหตุการณ์การกดปุ่ม และปล่อยปุ่ม สามารถเขียนโปรแกรมได้ดังนี้

ตัวอย่าง keyup jQuery ตัวอย่าง พร้อมคำอธิบาย

<input type="text" id="txt" placeholder="กรุณากรอกข้อมูล">

<script src="https://code.jquery.com/jquery-3.6.1.min.js" integrity="sha256-o88AwQnZB+VDvE9tvIXrMQaPlFFSUTR+nldQm1LuPXQ=" crossorigin="anonymous"></script>

<script>
    $("#txt").keyup(function(){
        console.log( $(this).val() );
    });
</script>

keyup jQuery จากตัวอย่างสร้าง input type="text" กำหนด id เป็น “txt” จากนั้นติดตั้ง jQuery แบบ CDN และเขียนโค้ด $("#txt").keyup หมายความว่าถ้าผู้ใช้งานกดปุ่ม และปล่อยปุ่มในช่อง Textbox ให้โปรแกรมทำงานในฟังก์ชันดังกล่าว โดยการพิมพ์ค่าจากใน Textbox ด้วยคำสั่ง console.log ร่วมกับ $(this).val()