In your html document include <script src="{path-to}/jquery-capslockstate.js"></script>

In a $(document).ready(function() {}); block you need to initialize the plugin. This is done with the code $(window).capslockstate();. The plugin monitors at the window level even if a different selector is used to initialize the plugin.

At any time after initialization you can query the Caps Lock state by calling the state method of capslockstate.

Calling the method is done as $(window).capslockstate("state"); Note that the selector used must match that used to initialize capslockstate.

There are three values for the Caps Lock state: true, false, and "unknown".

A boolean true value means that the Caps Lock key is on.

A boolean false value means that the Caps Lock key is off.

The string "unknown" means that there has not been enough page activity for capslockstate to know the state of the Caps Lock key. This is the default state when initialized, and changes when a key is pressed that relates to an upper or lower case character.

The "unknown" state can become active again because the plugin can't track the state of the Caps Lock key when the page isn't in focus. The "unknown" state becomes active when the page regains focus, not when it loses focus.

When the state of the Caps Lock key changes capslockstate will trigger two events. The first is a generic capsChanged event, the second is related to the new state.

This event is triggered when first entering the Caps Lock true state.

This event is triggered when first entering the Caps Lock false state.

This event is triggered when first entering the Caps Lock "unknown" state.

You can see and experiment with a working example of capslockstate.