KeyboardEvent ซึ่งคุณสมบัติ
ตัวอย่าง
รับค่า Unicode ของแป้นคีย์บอร์ดที่กด:
var x = event.which;
ตัวอย่าง "ลองใช้เอง" เพิ่มเติมด้านล่าง
ความหมายและการใช้งาน
คุณสมบัติใดส่งคืนรหัสอักขระ Unicode ของคีย์ที่ทริกเกอร์ เหตุการณ์ onkeypressหรือรหัสคีย์ Unicode ของคีย์ที่ทริกเกอร์เหตุการณ์onkeydownหรือ onkeyup
ความแตกต่างระหว่างรหัสทั้งสองประเภท:
- รหัสอักขระ - ตัวเลขที่แสดงถึงอักขระ ASCII
- รหัสคีย์ - ตัวเลขที่แสดงคีย์จริงบนแป้นพิมพ์
ประเภทเหล่านี้ไม่ได้หมายถึงสิ่งเดียวกันเสมอไป ตัวอย่างเช่น ตัวพิมพ์เล็ก "w" และตัวพิมพ์ใหญ่ "W" มีรหัสแป้นพิมพ์เหมือนกัน เพราะแป้นที่กดบนแป้นพิมพ์เหมือนกัน (แค่ "W" = ตัวเลข "87") แต่ต่างกัน รหัสอักขระเนื่องจากอักขระที่ได้จะแตกต่างกัน (ทั้ง "w" หรือ "W" ซึ่งก็คือ "119" หรือ "87") - ดู "ตัวอย่างเพิ่มเติม" ด้านล่างเพื่อทำความเข้าใจให้ดียิ่งขึ้น
เคล็ดลับ:หากต้องการทราบว่าผู้ใช้กดปุ่มพิมพ์ได้หรือไม่ (เช่น "a" หรือ "5") ขอแนะนำให้ใช้คุณสมบัตินี้ในเหตุการณ์ onkeypress หากต้องการทราบว่าผู้ใช้กดปุ่มฟังก์ชันหรือไม่ (เช่น "F1", "CAPS LOCK" หรือ "Home") ให้ใช้เหตุการณ์ onkeydown หรือ onkeyup
หมายเหตุ:คุณสมบัติใดที่ไม่รองรับใน IE8 และรุ่นก่อนหน้า สำหรับเบราว์เซอร์เวอร์ชันเหล่านี้ คุณสามารถใช้ คุณสมบัติkeyCode อย่างไรก็ตาม คุณสมบัติ keyCode ไม่ทำงานบนเหตุการณ์ onkeypress ใน Firefox สำหรับโซลูชันข้ามเบราว์เซอร์ คุณสามารถใช้รหัสต่อไปนี้:
var x = event.which || event.keyCode; // Use either which or keyCode, depending on browser support
เคล็ดลับ:สำหรับรายการอักขระ Unicode ทั้งหมด โปรดศึกษา การ อ้างอิง Unicode ฉบับสมบูรณ์ของ เรา
เคล็ดลับ:หากคุณต้องการแปลงค่า Unicode ที่ส่งคืนเป็นอักขระ ให้ใช้เมธอดfromCharCode()
หมายเหตุ:คุณสมบัตินี้เป็นแบบอ่านอย่างเดียว
หมายเหตุ:ทั้งคุณสมบัติ which และ keyCode มีไว้สำหรับความเข้ากันได้เท่านั้น เวอร์ชันล่าสุดของข้อกำหนดเหตุการณ์ DOM แนะนำให้ใช้ คุณสมบัติ คีย์แทน (ถ้ามี)
เคล็ดลับ:หากคุณต้องการทราบว่ามีการกดปุ่ม "ALT", "CTRL", "META" หรือ "SHIFT" หรือไม่เมื่อมีเหตุการณ์สำคัญ ให้ใช้ คุณสมบัติaltKey , ctrlKey , metaKeyหรือ shiftKey
รองรับเบราว์เซอร์
ตัวเลขในตารางระบุเบราว์เซอร์รุ่นแรกที่สนับสนุนคุณสมบัติอย่างสมบูรณ์
| Property | |||||
|---|---|---|---|---|---|
| which | Yes | 9.0 | Yes | Yes | Yes |
ไวยากรณ์
event.which
รายละเอียดทางเทคนิค
| คืนมูลค่า: | ตัวเลข แทนรหัสอักขระ Unicode หรือรหัสคีย์ Unicode |
|---|---|
| รุ่น DOM: | กิจกรรม DOM ระดับ 2 |
ตัวอย่างเพิ่มเติม
ตัวอย่าง
การใช้ onkeypress และ onkeydown เพื่อแสดงความแตกต่างระหว่างรหัสอักขระและรหัสแป้นพิมพ์:
<input type="text" onkeypress="uniCharCode(event)" onkeydown="uniKeyCode(event)">
function uniCharCode(event) {
var char = event.which || event.keyCode; // event.keyCode is used for IE8 and earlier
document.getElementById("demo").innerHTML = "Unicode CHARACTER code: " + char;
}
function uniKeyCode(event) {
var key = event.which || event.keyCode; // event.keyCode is used for IE8 and earlier
document.getElementById("demo2").innerHTML = "Unicode KEY code: " + key;
}
เมื่อกดปุ่ม "a" บนแป้นพิมพ์ (ไม่ใช้ caps lock) ผลลัพธ์ของcharและkeyจะเป็นดังนี้:
Unicode CHARACTER code: 97
Unicode KEY code: 65
ตัวอย่าง
แจ้งเตือนข้อความบางส่วนหากผู้ใช้กดปุ่ม Escape:
<input type="text" onkeydown="myFunction(event)">
function myFunction(event) {
var x = event.which || event.keyCode; // event.keyCode is used for IE8 and earlier
if (x == 27) { // 27 is the ESC key
alert ("You pressed the Escape key!");
}
}
ตัวอย่าง
แปลงค่า Unicode เป็นอักขระ (ใช้ไม่ได้กับปุ่มฟังก์ชัน):
var x = event.which || event.keyCode; // Get the Unicode value
var y = String.fromCharCode(x); // Convert the value into a character
หน้าที่เกี่ยวข้อง
การอ้างอิง HTML DOM: คุณสมบัติคีย์ KeyboardEvent
การอ้างอิง HTML DOM: คุณสมบัติคีย์โค้ดของ KeyboardEvent
การอ้างอิง HTML DOM: KeyboardEvent charCode Property