Keycode Checker

Keycode Checker adalah alat pengembang yang memungkinkan Anda memeriksa seketika bagaimana tombol keyboard yang Anda tekan di browser dikenali sebagai data event dalam JavaScript.

Dalam pengembangan frontend, deteksi tombol yang akurat diperlukan saat mengimplementasikan tombol pintas atau kontrol permainan berdasarkan masukan pengguna. Dengan alat ini, Anda bisa mendapatkan properti tombol seperti event.key, event.code, dan event.keyCode secara sekilas dan menyalinnya dengan satu klik. Ini juga memudahkan pengujian perilaku berbagai tata letak keyboard (seperti JIS vs US) dan kombinasi dengan tombol pengubah seperti Shift dan Ctrl.

Anda juga dapat memeriksa riwayat masukan keyboard dan menguji secara aman penekanan tindakan default browser (seperti pergerakan Tab atau pengguliran Space) di dalam browser saat e.preventDefault() diaktifkan.

event.key

Mewakili karakter atau fungsi yang sebenarnya dimasukkan oleh pengguna. Misalnya, menekan Shift + 1 pada keyboard US menghasilkan ! sebagai event.key. Ini adalah properti yang paling disarankan untuk mengevaluasi masukan logis.

event.code

Menunjukkan posisi fisik tombol yang ditekan. Terlepas dari tata letak bahasa keyboard, menekan tombol di posisi "A" akan selalu mengembalikan KeyA. Ini sangat berguna untuk tindakan yang bergantung pada tata letak fisik, seperti pergerakan WASD dalam game.

event.keyCode / event.which

Mengembalikan kode numerik spesifik sistem yang ditetapkan ke tombol yang ditekan (misalnya, 65 untuk A). Meskipun lama digunakan dalam pengembangan JavaScript, ini sekarang sudah usang (deprecated). Ini hanya boleh digunakan untuk pemeriksaan kompatibilitas ke belakang.

event.location

Angka yang menunjukkan wilayah fisik keyboard tempat tombol ditekan. Ini dapat membedakan antara tombol standar (0), pengubah kiri (1), pengubah kanan (2), dan tombol numpad (3).

preventDefault()

Metode JavaScript yang digunakan untuk membatalkan perilaku default browser yang dipicu oleh suatu event, seperti menggulir halaman ke bawah saat tombol Space ditekan.

Q.Apakah saya bisa menggunakan ini di ponsel pintar atau tablet?

Alat ini berfungsi dengan baik jika Anda menghubungkan keyboard fisik. Namun, dengan keyboard perangkat lunak di layar, event keydown mungkin tidak dipicu dengan benar tergantung pada sistem operasi atau implementasi browser, atau mungkin selalu mengembalikan kode kunci yang sama (misalnya, 229). Alat ini ditujukan untuk digunakan dengan keyboard fisik.

Q.Haruskah saya menggunakan event.key atau event.code?

Tergantung pada kasus penggunaan Anda. Jika Anda ingin mengevaluasi arti tombol atau karakter yang dimasukkan (misalnya, 'Tekan Enter untuk mengirim'), gunakan event.key. Di sisi lain, jika Anda ingin mendasarkan tindakan pada posisi fisik pada keyboard (misalnya, 'Gerakkan karakter dengan W, A, S, D'), menggunakan event.code adalah praktik terbaik.

Q.Dapatkah saya mencegah pintasan seperti F5 atau Ctrl+W?

Bahkan jika Anda menggunakan e.preventDefault() dari JavaScript, Anda mungkin tidak dapat sepenuhnya mencegah tombol pintas kuat yang dicadangkan di tingkat keamanan atau OS/browser, seperti menutup tab, memuat ulang jendela, atau membuka alat pengembang browser.

Q.Mengapa event.keyCode tidak lagi disarankan (deprecated)?

Karena nilai numerik yang dikembalikan dapat bervariasi tergantung pada browser, sistem operasi, dan tata letak keyboard, yang menyebabkan masalah kompatibilitas. Saat ini disarankan untuk menggunakan event.key atau event.code.

Q.Apakah data tombol yang dimasukkan dikirim ke server?

Tidak, tidak dikirim. Semua pemrosesan diselesaikan menggunakan JavaScript di dalam browser Anda, dan riwayat masukan tombol Anda tidak pernah dikirim atau disimpan di server eksternal mana pun.

Berikut adalah skenario pengembangan khas di mana memeriksa kode kunci diperlukan.