Thursday, August 14, 2014

How to Display Message "Caps Lock is on" on Password Text Box Using Javascript.

Below is the Script to identify if the Caps Lock is on  While typing on password text box.

Caps Lock is On Message Display.


sample code:
   <script type="text/javascript" language="Javascript">
        function capLock(e) {
            kc = e.keyCode ? e.keyCode : e.which;
            sk = e.shiftKey ? e.shiftKey : ((kc == 16) ? true : false);
            if (((kc >= 65 && kc <= 90) && !sk) || ((kc >= 97 && kc <= 122) && sk))
                document.getElementById('divMayus').style.visibility = 'visible';
            else
                document.getElementById('divMayus').style.visibility = 'hidden';
        }
    </script>


Call this Function on the keypress event of the Password Text Box.
onkeypress="capLock(event)"

Now, The Message will be displayed on the div with id="divMayus" as below.

<div id="divMayus" style="visibility: hidden; "><P style="color:red;">Caps Lock is on.</P></div>