JSFiddle - React, Tailwind, and code Playground
HTML
<input type="password" id="password">
JavaScript
document.onkeydown = function (e) { //check if capslock key was pressed in the whole window
e = e || event;
if (typeof (window.lastpress) === 'undefined') {
window.lastpress = e.timeStamp-51;
}
if (e.keyCode == 20 && e.timeStamp > window.lastpress + 50) {
// window.capsLockEnabled = !window.capsLockEnabled;
if (!$(document).data("capsOn")) {
$(document).data("capsOn", true);
} else {
$(document).data("capsOn", false);
}
}
window.lastpress = e.timeStamp;
//sometimes this function is called twice when pressing capslock once, so I use the timeStamp to fix the problem
};
$("#password").click(function () {
if ($(document).data("capsOn")) {
alert("CAPS ON");
}
});