Cómo detectar las mayúsculas “Caps Lock” con JavaScript

Una de las situaciones más frecuentes a la hora de recordar contraseñas es saber si la escribiste con mayúsculas o con minúsculas, por eso algunos programas incluyen un mecanismo para identificar cuando tienes presionada/activada la tecla “Caps Lock” o “Bloq Mays” pero para la web es imposible detectar cuando tenemos activada dicha tecla.

Pero no todo es imposible ya que con un simple truco podemos deducir que está activada, lo que podemos hacer es gracias a la programación DOM que podemos ser notificados cuando presionamos alguna tecla para escribir alguna letra, cuando una tecla es presionada en realidad se obtiene un código ASCII del caracter en cuestión los caracteres en mayúsculas tiene un código ASCII que vá desde el 65 hasta el 90, para eso existe un script escrito en JavaScript llamado jsCapsLock.

Cómo usar jsCapsLock

Primero descargamos el Script desde aquí, luego incluimos este código dentro del head de nuestro HTML:

<script src="jscapslock.js" type="text/javascript"></script>
<script type="text/javascript">
    capslock.show_warning(target) {
    // Puedes poner una alerta para avisar al usuario
    }
    capslock.hide_warning(target) {
    // aquí ocultas la alerta
    }
</script>

Puedes ver un ejemplo de su funcionamiento. Más información en 24 Ways que es donde aprendí esto.