ก่อนอื่นให้เข้าใจความแตกต่างระหว่างแต่ละเหตุการณ์
Keydown: เกิดขึ้นเมื่อกดปุ่มเมื่อการควบคุมมีโฟกัส
KeyPress: เกิดขึ้นเมื่อกดปุ่มเมื่อการควบคุมมีโฟกัส
KEYUP: เกิดขึ้นเมื่อคีย์ถูกปล่อยเมื่อการควบคุมมีโฟกัส
1. คีย์กดส่วนใหญ่จะใช้เพื่อรับอักขระ ANSI เช่นตัวอักษรและตัวเลข กระบวนการของ Keydown และ Keyup สามารถจับคีย์ทั้งหมดบนแป้นพิมพ์ยกเว้น PRSCRN (คีย์พิเศษสำหรับคีย์บอร์ดพิเศษจะไม่กล่าวถึงที่นี่
2. KeyPress สามารถจับอักขระตัวเดียวได้ในขณะที่ Keydown และ Keyup สามารถจับการรวมกันของคีย์ได้
3. KeyPress ไม่แสดงสถานะทางกายภาพของแป้นพิมพ์ (คีย์ Shift) แต่ผ่านอักขระเท่านั้น Keypress ตีความรูปแบบตัวพิมพ์ใหญ่และตัวพิมพ์เล็กของแต่ละอักขระเป็นรหัสคีย์ที่แตกต่างกันนั่นคือเป็นอักขระที่แตกต่างกันสองตัว Keydown และ KeyUp ไม่สามารถกำหนดขนาดของตัวอักษรคีย์-ค่า Keydown และ Keyup ตีความรูปแบบตัวพิมพ์ใหญ่และตัวพิมพ์เล็กของตัวอักษรแต่ละตัวที่มีพารามิเตอร์สองตัว: ปุ่มกด - แสดงคีย์กายภาพ พวกเขา.
5. Keypress ไม่ได้แยกความแตกต่างระหว่างอักขระตัวเลขของปุ่มกดและแป้นพิมพ์หลักในขณะที่ Keydown และ Keyup แยกความแตกต่างระหว่างอักขระตัวเลขของปุ่มกดและแป้นพิมพ์หลัก
6. เหตุการณ์ Keydown และ KeyUp เกิดขึ้นเมื่อ (keydown) หรือ release (keyup) คีย์ เนื่องจากปุ่มแป้นพิมพ์มักจะถูกผลักออกไปทันที (ซึ่งแตกต่างจากเมาส์) จึงไม่มีความแตกต่างกันมากระหว่างเหตุการณ์ทั้งสองนี้ ยิ่งไปกว่านั้นมีความแตกต่างอีกอย่างระหว่าง UP และอีกสอง: เพื่อตัดสินสถานะที่ได้รับการแก้ไขของคีย์จะต้องใช้ UP
เราสามารถใช้เหตุการณ์คีย์ดาวน์เพื่อบล็อกอินพุตของผู้ใช้ตัวอย่างเช่นฟิลด์อินพุตบางอย่างสามารถป้อนหมายเลขได้เท่านั้น
ปุ่มกดของปุ่มตัวเลขบนแป้นพิมพ์
[48-57] คีย์หมายเลข
[96-105] ปุ่มกดตัวเลข
ยังอนุญาตให้ลบคีย์ backspace
รหัสมีดังนี้
การคัดลอกรหัสมีดังนี้:
var input = document.getElementById ('number_ipt')
input.onkeydown = function (e) {
var keycode = e.keycode
if (! ISNUMBER (KYCODE)) ส่งคืน FALSE
-
// สามารถป้อนตัวเลขเท่านั้น
ฟังก์ชั่น ISNUMBER (ปุ่มกด) {
// ตัวเลข
if (keycode> = 48 && keycode <= 57) ส่งคืนจริง
// คีย์บอร์ดตัวเลขขนาดเล็ก
if (keycode> = 96 && keycode <= 105) ส่งคืนจริง
// backspace key
if (keycode == 8) ส่งคืนจริง
กลับเท็จ
-