JS 实现提示【大写锁定已打开】

JS 实现提示【大写锁定已打开】

<div class="form-group">
     <label class="control-label" for="passwd">密码</label>
      <input type="password" class="form-control input-dark" name="password" id="passwd" autocomplete="off" onkeyup="this.value=this.value.replace(/^ +| +$/g,'')"/>
      <span id="passwdtitle"></span>
</div>

js

<script type="text/javascript">
     document.querySelector("#passwd").addEventListener('keyup', handler);  //id选择器
     document.querySelector("#passwd").addEventListener('mousedown', handler);
     function handler(e) {
         if(e.getModifierState('CapsLock')){
             $("#passwdtitle").html("大写锁定已打开").css("background","red");
             //console.log('大写锁定已打开');
         }else {
             $("#passwdtitle").html("");
         }
     }
</script>     

效果图：


参考资料: