用 JavaScript 检测键盘大写锁定键的状态 - JS 判断大写锁定

用户在输入密码的时候,由于看不到输入的字母,这时如果 Caps Lock 大写锁定键打开,会给用户造成不必要的困扰。让我们看看如何使用JavaScript检测大写锁定。

KeyboardEvent 上有一个名为 getmodifierState 的方法,我们可以使用它来执行此操作。这可以在键盘相关事件的事件侦听器内部访问:

js 复制代码
document.querySelector('input[type=password]')
  .addEventListener('keyup', (keyboardEvent) => {
    const isCapsLockOn = keyboardEvent.getModifierState('CapsLock');
    if (isCapsLockOn) {
        // code for notifying the user goes here
    }
});

这段代码告诉我们如何使用 JavaScript 检测大写锁定键。如果我们愿意的话,我们还可以使用 keydown 方法而不是 keyup。但 keyup 有更好的浏览器支持,所以我们更喜欢使用它。如果您有任何问题,请在评论中告诉我们。

参考文档:How to detect caps lock with JavaScript

相关推荐
计算机安禾16 小时前
【c++面向对象编程】第25篇:仿函数(函数对象):重载operator()
开发语言·c++·算法
Rust语言中文社区16 小时前
【Rust日报】2026-05-14 Pyrefly v1.0 正式发布:快速的 Python 类型检查器和语言服务器
开发语言·后端·python·rust
kkeeper~16 小时前
0基础C语言积跬步之深入理解指针(4)
c语言·开发语言
周末也要写八哥17 小时前
在C++中使用预定义宏
开发语言·c++·算法
Data_Journal17 小时前
使用Python lxml轻松进行网络爬取
开发语言·php
xcLeigh17 小时前
IoTDB JDBC 完整使用教程:连接、查询、批处理与字符集配置
开发语言·数据库·qt·iotdb·查询·批处理·连接
学会870上岸华师17 小时前
C 语言程序设计——第一章课后编程题
c语言·开发语言·学习·算法
小小编程路17 小时前
新手快速学 Python 极简速成指南
开发语言·c++·python
zz58817 小时前
面试官问"JS的类型"时,到底想听到什么?
javascript
gjwjuejin17 小时前
全埋点技术方案深度剖析:从事件代理到无痕采集的完整实现
javascript