Để kiểm tra Caps Lock có đang bật trong ô nhập liệu với JavaScript, mã như sau:
Ví dụ
<!DOCTYPE html> <html> <head> <style> #textBox { display: none; color: red; } </style> <body> <h1>Ví dụ Phát Hiện Caps Lock</h1> <input class="inputfield" value="Một số văn bản.." /> <h2>Bật Caps Lock trong ô nhập liệu trên để xem cảnh báo</h2> <h2 class="textBox">CẢNH BÁO! Caps lock đang BẬT.</h2> <script> var input = document.querySelector(".inputfield"); var textBox = document.querySelector(".textBox"); input.addEventListener("keyup", event => { if (event.getModifierState("CapsLock")) { textBox.style.display = "block"; } else { textBox.style.display = "none"; } }); </script> </body> </html>
Kết quả
Mã trên sẽ cho ra kết quả sau:
Khi gõ nội dung trong ô nhập liệu với Caps Lock bật:
