Archives

Zed Developer

zed development is comprised of a team of highly qualified and self motivated individuals. The passion which each member holds for their work allows us to be a major asset to IT firm; whether they are looking for a one-off service or a longer relationship in order to build their firm through use of our dedicated marketing department.

In this tutorial we will see how to notify the user whether the capslock is on/off when he/she is typing the password. This is very simple to understand and use example of that. You can complete this task using JavaScript described below.


Add this JavaScript in page before </head> tag. If you are using any external JavaScript than u can add capLock() function to that .js file.

<script 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('divCaps').style.visibility = 'visible';
else
document.getElementById('divCaps').style.visibility = 'hidden';
}
</script>

Now, add this event onkeypress="capLock(event)" to the control. In my example, u can see that I have used it in textbox.

<input type="password" name="txtPassword" onkeypress="capLock(event)" />
<div id="divCaps" style="visibility:hidden">Caps Lock is on.</div>



Here, the capLock() function checks whether the capslock is on or off on the users pc and according to that it set the visibility of the div ‘divCaps’.

Categories