Cómo detectar el bloqueo de mayúsculas

Aprende a usar JavaScript para detectar si el bloqueo de mayúsculas está activado en el cuadro de entrada.

Detectar si el bloqueo de mayúsculas está activado

Intenta presionar la tecla "Caps Lock" en el cuadro de entrada:

¡ADVERTENCIA! El bloqueo de mayúsculas está activado.

Ejemplo

// Obtén el campo de entrada
var input = document.getElementById("myInput");
// Obtén el texto de advertencia
var text = document.getElementById("text");
// Al presionar cualquier tecla en el teclado, ejecuta esta función
input.addEventListener("keyup", function(event) {
  // Si se presionó "Caps Lock", muestra el texto de advertencia
  if (event.getModifierState("CapsLock")) {
    text.style.display = "block";
  } else {
    text.style.display = "none"
  }
);

Prueba personalmente

Páginas relacionadas

Manual de referencia:Método getModifierState() de MouseEvent