MouseEvent getModifierState() 方法
JavaScript基础 2022-06-08 12:05:31小码哥的IT人生shichen
MouseEvent getModifierState() 方法
实例
Caps Lock 键是否已激活？
var x = event.getModifierState("CapsLock");
完整实例：
<!DOCTYPE html>
<html>
<body>
<h1>Caps Lock 是否已激活？</h1>
<p>单击输入字段，然后激活 CapLock 键并再次单击输入字段：</p>
<input type="text" size="40" onmousedown="myFunction(event)">
<p><b>注释：</b>Safari 10 或 IE 8 及更早版本不支持 getModifierState() 方法。</p>
<p id="demo"></p>
<script>
function myFunction(event) {
var x = event.getModifierState("CapsLock");
document.getElementById("demo").innerHTML = "Caps Lock activated: " + x;
}
</script>
</body>
</html>
可以使用本站在线JavaScript测试工具测试上述代码运行效果：http://www.phpcodeweb.com/runjs.html
定义和用法
如果指定的修饰键被按下或激活，则 getModifierState() 方法返回 true。
仅在按下时激活的修饰键：
- Alt
- AltGraph
- Control
- Meta
- Shift
单击时激活，再次单击时停用的修饰键：
- CapsLock
- NumLock
- ScrollLock
浏览器支持
表格中的数字注明了完全支持该方法的首个浏览器版本。
| 方法 | Chrome | IE | Firefox | Safari | Opera |
|---|---|---|---|---|---|
| getModifierState() | 30 | 9.0 | 15 | 10.1 | 17 |
语法
event.getModifierState(modifierKey)
参数值
| 参数 | 描述 |
|---|---|
| modifierKey |
检查键是否已被激活。合法值：
|
技术细节
| 返回值： | 布尔值，如果指定的修饰键被激活，则为 true，否则为 false。 |
|---|---|
| DOM 版本： | DOM Level 3 Events |
更多实例
示例代码：
shift 键是否被按下？
var x = event.getModifierState("Shift");
完整实例：
<!DOCTYPE html>
<html>
<body>
<h1>是否按下了 Shift 键？</h1>
<p>请单击输入字段，然后按住 Shift 键并再次单击输入字段：</p>
<input type="text" size="40" onmousedown="myFunction(event)">
<p><b>注释：</b>Safari 10 或 IE 8 及更早版本不支持 getModifierState() 方法。</p>
<p id="demo"></p>
<script>
function myFunction(event) {
var x = event.getModifierState("Shift");
document.getElementById("demo").innerHTML = "Pressing the shift key: " + x;
}
</script>
</body>
</html>
可以使用本站在线JavaScript测试工具测试上述代码运行效果：http://www.phpcodeweb.com/runjs.html
