คุณสมบัติ which ของ KeyboardEvent

คำอธิบายและวิธีใช้

which มีความหมายว่าปุ่มที่ทำให้เกิดเหตุการณ์ เหตุการณ์ onkeypress รหัสตัวอักษร Unicode ของปุ่มที่กด หรือที่ทำให้เกิดเหตุการณ์ onkeydown หรือ onkeyup รหัสทางปุ่ม Unicode ของปุ่มที่กด

ความแตกต่างระหว่างสองประเภทรหัส

  • รหัสตัวอักษร - ตัวเลขที่แสดงถึงตัวอักษร ASCII
  • รหัสทางปุ่ม - ตัวเลขที่แสดงถึงปุ่มที่กดบนแป้นพิมพ์

ประเภทเหล่านี้ไม่จำเป็นที่จะหมายถึงสิ่งเดียวกันทุกครั้ง。ตัวอย่างเช่น รหัสทางปุ่มของ "w" ในรูปแบบตัวเล็กและ "W" ในรูปแบบใหญ่เหมือนกัน ตรงที่ที่กดทางปุ่มในแป้นพิมพ์เหมือนกัน ("W" = ตัวเลข "87"), แต่รหัสตัวอักษรต่างกัน เพราะตัวอักษรที่ได้เป็นผลลัพธ์ต่างกัน ("w" หรือ "W" คือ "119" หรือ "87")- โปรดดูตัวอย่างด้านล่างเพื่อเข้าใจความหมายนี้ดียิ่งขึ้น。

คำเตือน:ถ้าต้องการตรวจสอบว่าผู้ใช้กดทางปุ่มที่สามารถพิมพ์ได้ (เช่น "a" หรือ "5"), แนะนำให้ใช้คุณสมบัตินี้ในเหตุการณ์ onkeypress นี้。เพื่อตรวจสอบว่าผู้ใช้กดทางปุ่มฟังก์ชัน (เช่น "F1"、"CAPS LOCK" หรือ "Home"), ใช้เหตุการณ์ onkeydown หรือ onkeyup。

หมายเหตุ:IE8 และตัวเวอร์ชั่นที่เก่ากว่านั้นไม่สนับสนุนคุณสมบัติ which อยู่ สำหรับตัวเวอร์ชั่นนี้คุณสามารถใช้คุณสมบัติ keyCode แทน แต่คุณสมบัติ keyCode ไม่ทำงานกับเหตุการณ์ onkeypress ใน Firefox สำหรับความแก้ไขที่เพื่อให้เป็นแก้ไขที่สามารถใช้งานได้ทั้งบราวเซอร์ ใช้โค้ดดังนี้:

var x = event.which || event.keyCode;  // ใช้ which หรือ keyCode ขึ้นอยู่กับการสนับสนุนของบราวเซอร์

คำเตือน:สำหรับบรรณานุกรมความรู้ Unicode ทั้งหมด โปรดดู ความอ้างอิง Unicode ทั้งหมด.

คำเตือน:หากต้องการแปลงค่า Unicode ให้เป็นอักษร ใช้ fromCharCode() วิธี.

หมายเหตุ:คุณสมบัตินี้เป็นคุณสมบัติที่แสดงที่เดียว

หมายเหตุ:ระบุค่า keyCode และ which ครับเพื่อความสามารถเปรียบเทียบเพื่อความสะดวกในการใช้งาน ตามมาตราฐานการระบุเหตุการณ์ DOM ล่าสุดแนะนำใช้ค่า property ที่มีอยู่ในกรณีที่เป็นไปได้

คำเตือน:หากคุณต้องการรู้ว่าคุณกดปุ่ม "ALT"、"CTRL"、"META" หรือ "SHIFT" ในขณะที่เกิดเหตุการณ์การกดปุ่มเมาส์ ใช้ altKeyctrlKeymetaKey หรือ shiftKey คุณสมบัติ

ตัวอย่าง

เรียกใช้ค่า Unicode ของปุ่มที่กดลง

var x = event.which;

มีตัวอย่าง TIY มากมายที่ด้านล่างของหน้า

ทดลองด้วยตัวเอง

รูปแบบการใช้

event.which

รายละเอียดเทคนิค

ค่าที่คืนค่ามา: ค่าเลขที่แสดงค่ารหัสอักษร Unicode หรือรหัสแป้นแปลงตัว
DOM รุ่น: DOM Level 2 Events

การสนับสนุนโดยบราวเซอร์

ตัวเลขในตารางระบุตอนที่บราวเซอร์แรกที่สนับสนุนคุณสมบัตินี้ให้เต็มทั้งหมด

คุณสมบัติ Chrome IE Firefox Safari Opera
which สนับสนุน 9.0 สนับสนุน สนับสนุน สนับสนุน

ตัวอย่างเพิ่มเติม

ตัวอย่าง

ใช้ onkeypress และ onkeydown ในการแสดงถึงความแตกต่างระหว่างรหัสอักษรและรหัสแป้นแปลงตัว

<input type="text" onkeypress="uniCharCode(event)" onkeydown="uniKeyCode(event)"> 
function uniCharCode(event) {
  var char = event.which || event.keyCode; // event.keyCode ใช้ใน IE8 และตัวรุ่นเก่าของ IE
  document.getElementById("demo").innerHTML = "Unicode CHARACTER code: " + char;
}
function uniKeyCode(event) {
  var key = event.which || event.keyCode; // event.keyCode ใช้ใน IE8 และตัวรุ่นเก่าของ IE
  document.getElementById("demo2").innerHTML = "Unicode KEY code: " + key;
}

ขณะกดปุ่ม "a" บนแป้นพิมพ์ (ไม่ใช้ Capslock) ค่า 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 ใช้ใน IE8 และตัวรุ่นเก่าของ IE
  if (x == 27) {  // 27 คือปุ่ม ESC
    alert ("คุณกดปุ่ม Escape!");
  }
}

ทดลองด้วยตัวเอง

ตัวอย่าง

ความหมายของค่า Unicode ในตัวอักษร (ไม่ใช้ได้สำหรับปุ่มที่มีฟังก์ชัน):

var x = event.which || event.keyCode;   // รับค่า Unicode
var y = String.fromCharCode(x);         // ความหมายในตัวอักษร

ทดลองด้วยตัวเอง

หน้าที่เกี่ยวข้อง

คู่มือ HTML DOM ตามหลัก:คุณสมบัติ key ของ KeyboardEvent

คู่มือ HTML DOM ตามหลัก:คุณสมบัติ keyCode ของ KeyboardEvent

คู่มือ HTML DOM ตามหลัก:คุณสมบัติ charCode ของ KeyboardEvent