Rumah > hujung hadapan web > tutorial js > Bagaimanakah Saya Boleh Mengesan Keadaan Caps Lock dengan Elegan dalam JavaScript?

Bagaimanakah Saya Boleh Mengesan Keadaan Caps Lock dengan Elegan dalam JavaScript?

Mary-Kate Olsen
Lepaskan: 2024-11-02 03:35:29
asal
708 orang telah melayarinya

How Can I Elegantly Detect Caps Lock State in JavaScript?

Mengesan Keadaan Caps Lock dalam JavaScript dengan Keanggunan

Manakala pendekatan konvensional melampirkan pendengar acara pada setiap medan input untuk menyemak huruf besar ditekan tanpa kekunci Shift nampaknya tidak cekap, JavaScript menawarkan penyelesaian yang lebih canggih. Objek KeyboardEvent datang untuk menyelamatkan dengan kaedah getModifierStatenya.

Kaedah ini memberikan maklumat tentang keadaan pelbagai kekunci pengubah suai, termasuk Caps Lock. Dengan menggunakan keupayaan ini, anda boleh dengan mudah menentukan sama ada Caps Lock didayakan:

<code class="javascript">passwordField.addEventListener('keydown', function(event) {
  var caps = event.getModifierState && event.getModifierState('CapsLock');
  console.log(caps); // Output: True when Caps Lock is pressed
});</code>
Salin selepas log masuk

Kaedah getModifierState mengembalikan nilai boolean yang menunjukkan keadaan ditekan kekunci Caps Lock. Pendekatan ini bukan sahaja lebih ringkas daripada kaedah brute-force tetapi juga berfungsi secara konsisten merentas penyemak imbas utama, termasuk penyemak imbas mudah alih.

Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Mengesan Keadaan Caps Lock dengan Elegan dalam JavaScript?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

sumber:php.cn
Kenyataan Laman Web ini
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
Artikel terbaru oleh pengarang
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan