Rumah >hujung hadapan web >tutorial js >Apakah Perbezaan Antara KeyDown, KeyUp dan Acara KeyPress Dihentikan?

Apakah Perbezaan Antara KeyDown, KeyUp dan Acara KeyPress Dihentikan?

DDD
DDDasal
2024-12-04 21:08:11614semak imbas

What's the Difference Between KeyDown, KeyUp, and the Deprecated KeyPress Events?

Memahami Peristiwa KeyPress, KeyUp dan KeyDown

Untuk membezakan antara peristiwa penekan kekunci, keyup dan keydown, pertimbangkan peristiwa tersebut serupa dengan peristiwa tetikus: klik, tetikus ke atas dan tetikus ke bawah. Peristiwa onKeyDown tercetus apabila anda menekan mana-mana kekunci, sama seperti tetikus turun.

OnKeyUp tercetus apabila anda melepaskan kekunci, seperti tetikus. Adalah penting untuk memahami bahawa anda boleh melepaskan kekunci (onKeyUp) tanpa menekannya terlebih dahulu (onKeyDown). Ini selalunya berlaku apabila kekunci ditahan dan kemudian dikeluarkan akhirnya, mencetuskan kedua-dua peristiwa.

OnKeyPress, bagaimanapun, kini ditamatkan dan harus digantikan dengan onKeyDown. Ia pernah menggabungkan acara onKeyDown dan onKeyUp, berkelakuan serupa dengan onKeyPress, tetapi penggunaan ini tidak lagi disyorkan.

Pengecualian untuk Penyemak Imbas Webkit

Pelayar berasaskan WebKit memperkenalkan tambahan acara: TextInput. Peristiwa ini berlaku antara tekan kekunci dan kekunci, khususnya apabila teks dimasukkan. Urutan peristiwa dalam penyemak imbas WebKit adalah seperti berikut:

  • Keydown
  • Keypress
  • TextInput
  • Keyup

Interaktif Demonstrasi

Untuk menggambarkan urutan penembakan acara, cuba coretan kod berikut:

window.addEventListener("keyup", log);
window.addEventListener("keypress", log);
window.addEventListener("keydown", log);

function log(event) {
  console.log(event.type);
}

Kod ini merekodkan jenis acara ke konsol apabila setiap kekunci ditekan atau dilepaskan. Ia akan membantu anda memahami perbezaan dan susunan acara ini.

Atas ialah kandungan terperinci Apakah Perbezaan Antara KeyDown, KeyUp dan Acara KeyPress Dihentikan?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn