การรับค่าการกดแป้นพิมพ์ใน JavaScript

การใช้ object Event สามารถ รับค่าการกดแป้นพิมพ์ได้ มาดูกันว่า ทำอย่างไร สมมติว่าเรามี input:

<input>

รับ reference ไปยัง input เก็บในตัวแปร:

let elem = document.querySelector('input');

เพิ่ม event ให้กับ input ของเรา ที่จะทำงานทุกครั้งที่กดแป้นพิมพ์:

elem.addEventListener('keypress', function(event) {
	
});

ใน property key ของ object event จะมี ตัวอักษรที่กดอยู่:

elem.addEventListener('keypress', function(event) {
	console.log(event.key);
});

และใน property code จะมี รหัสของแป้นพิมพ์ที่กดอยู่:

elem.addEventListener('keypress', function(event) {
	console.log(event.code);
});

สร้าง input ที่จะ แสดงค่าของแป้นพิมพ์ที่กด และรหัสของพวกมันเมื่อมีการป้อนข้อมูล

ลองกดแป้นต่างๆ ใน input และดูว่ามีค่า และรหัสอะไรบ้าง

กำหนดว่ารหัสของ แป้น Enter คืออะไร

กำหนดว่ารหัสของ แป้น BackSpace คืออะไร

มี paragraph และ input ข้อความจะถูกป้อนลงในนั้น และกดแป้น Enter ทำให้ ข้อความที่ป้อน ไปปรากฏใน paragraph ใต้ input และเนื้อหาใน input ถูกล้าง