Para verificar se o caps lock está ativado, você usa o getModifierState()método do KeyboardEventobjeto:
const capslockIsOn = event.getModifierState(modifier);Linguagem de código: JavaScript ( javascript )O getModifierState()método retorna truese a modifierestiver ativo; caso contrário, ele retorna false.
O event.getModifierState('CapsLock')pode ser usado para detectar se o caps lock está ativado.
Suponha que você tenha um campo de senha como este:
<input type="password" name="password" id="password" placeholder="Enter a password">
<div class="message"></div>Linguagem de código: HTML, XML ( xml )O seguinte mostra uma mensagem de aviso se você ativar o caps lock e digitar a senha:
const password = document.querySelector('#password');
const message = document.querySelector('.message');
password.addEventListener('keyup', function (e) {
if (e.getModifierState('CapsLock')) {
message.textContent = 'Caps lock is on';
} else {
message.textContent = '';
}
});Linguagem de código: JavaScript ( javascript )Demonstração:
