บทนำ
คุณสมบัติ altKey ของ Keyboard Event ใน JavaScript ใช้เพื่อตรวจสอบว่า Alt (หรือ Option ⌥ บน Mac) ถูกกดค้างอยู่หรือไม่ในขณะที่เกิดเหตุการณ์แป้นพิมพ์ (keydown, keyup, keypress) คุณสมบัตินี้จะคืนค่า true หาก Alt ถูกกดอยู่ และ false หากไม่ได้กด
ตัวอย่างการใช้งาน
ลองรันโค้ดด้านล่างแล้วกดแป้นพิมพ์พร้อมกับกด Alt ค้าง:
<!DOCTYPE html>
<html>
<body>
<input type="text" onkeydown="funcAltKey(event)" placeholder="กดแป้นพิมพ์พร้อม Alt...">
<div id="res" style="margin-top:10px; font-weight:bold;">กดแป้นพิมพ์ใดๆ</div>
<script>
function funcAltKey(event) {
var val = document.getElementById("res");
if (event.altKey) {
val.innerHTML = "Alt: กดอยู่ (event.altKey = true)";
} else {
val.innerHTML = "Alt: ไม่ได้กด (event.altKey = false)";
}
}
</script>
</body>
</html>
คำอธิบายเพิ่มเติม
event.altKeyเป็นคุณสมบัติแบบ Read-only (อ่านอย่างเดียว)- ทำงานร่วมกับเหตุการณ์คีย์บอร์ดทั้งหมด:
keydown,keyup,keypress - บน Mac: Alt = Option ⌥, Ctrl = Control ⌃, Meta = Command ⌘
- มักใช้ร่วมกับคีย์ลัด (Shortcuts) เช่น Alt+F4 ปิดหน้าต่าง, Alt+Tab สลับโปรแกรม
คุณสมบัติ Modifier Keys อื่นๆ ใน Keyboard Event
| คุณสมบัติ | ปุ่มที่ตรวจสอบ (Windows/Linux) | ปุ่มที่ตรวจสอบ (Mac) |
|---|---|---|
altKey | Alt | Option ⌥ |
ctrlKey | Ctrl | Control ⌃ |
metaKey | Windows Key ⊞ | Command ⌘ |
shiftKey | Shift | Shift ⇧ |
ตัวอย่างตรวจสอบหลายปุ่มพร้อมกัน
<!DOCTYPE html>
<html>
<body>
<input type="text" onkeydown="checkModifiers(event)" placeholder="กดแป้นพิมพ์พร้อม Ctrl/Alt/Shift...">
<div id="modifiers" style="margin-top:10px; font-family:monospace;"></div>
<script>
function checkModifiers(event) {
var keys = [];
if (event.ctrlKey) keys.push("Ctrl");
if (event.altKey) keys.push("Alt");
if (event.shiftKey) keys.push("Shift");
if (event.metaKey) keys.push("Meta");
var msg = keys.length ? keys.join(" + ") + " + " + event.key : event.key;
document.getElementById("modifiers").textContent = "กด: " + msg;
}
</script>
</body>
</html>
ตารางสรุปค่าที่คืน
| สถานะ | ค่าที่คืน |
|---|---|
| กด Alt ค้าง | true |
| ไม่ได้กด Alt | false |