Skip welcome & menu and move to editor
Welcome to JS Bin
Load cached copy from
 
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>JS Bin</title>
</head>
<body>
  <div id="input-field">
    <span id="caps-led"></span>
    <input onkeyup="isCapslock(event)" />
 </div>
  
</body>
</html>
 
const capsElement = document.querySelector("#caps-led");
document.addEventListener("keypress",
                          (e)=> {
  let result = isCapslock(e);
  console.log(`caps ${result}`);
  
  capsElement.classList.toggle("on", result);
});
function isCapslock(e){
    e = (e) ? e : window.event;
    let charCode = e.keyCode;
    let shifton = false;
 
   if (e.shiftKey) {
        shifton = e.shiftKey;
    } else if (e.modifiers) {
        shifton = !!(e.modifiers & 4);
    }
    if (charCode >= 97 && charCode <= 122 && shifton) {
        return true;
    }
    if (charCode >= 65 && charCode <= 90 && !shifton) {
        return true;
    }
    return false;
}
Output

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
rajeshpillaipro
0viewers