-
-
Save jasongaylord/7797819 to your computer and use it in GitHub Desktop.
| <html> | |
| <head> | |
| <title>Test Caps Lock</title> | |
| </head> | |
| <body> | |
| <div id="capsLockWarning" style="font-weight: bold; color: maroon; margin: 0 0 10px 0; display: none;">Caps Lock is on.</div> | |
| Username: <input type="text" id="username" /><br/> | |
| Password: <input type="password" id="password" /> | |
| </body> | |
| <script language="javascript"> | |
| function isCapsLockOn(e) { | |
| var keyCode = e.keyCode ? e.keyCode : e.which; | |
| var shiftKey = e.shiftKey ? e.shiftKey : ((keyCode == 16) ? true : false); | |
| return (((keyCode >= 65 && keyCode <= 90) && !shiftKey) || ((keyCode >= 97 && keyCode <= 122) && shiftKey)) | |
| } | |
| function showCapsLockMsg(e) { | |
| var warningElement = document.getElementById('capsLockWarning'); | |
| if (isCapsLockOn(e)) | |
| warningElement.style.display = 'block'; | |
| else | |
| warningElement.style.display = 'none'; | |
| } | |
| document.onkeypress = function (e) { | |
| e = e || window.event; | |
| showCapsLockMsg(e); | |
| } | |
| </script> | |
| </html> |
@poteirard and @jasongaylord : Both the solutions are not working on Android mobile browser!
@aniruddhashevle I probably won't get a chance to test this out on Android today. One recommendation I have is to output the value of e.keyCode to the browser. It should be the correct keyCode. Also, are you just checking for the keyCode or are you doing this entire gist?
@jasongaylord : It doesn't output anything if we press the shift button on a browser on an Android device. I've checked with keyCode, charCode, shiftKey, which, etc. No luck!
@aniruddhashevle So in that case, I'd probably recommend falling back to performing a regex check on the string entered and look for all caps. Unfortunately, mobile/software keyboards do not always have keypress listeners. Out of curiosity, is it all keyboards or a specific one like the stock Android or Samsung's?
@jasongaylord: Even if we check if the entered character is a capital letter or not, doesn't actually mean that the CapsLock is ON. As We can just press Shift + any char to add a capital letter anyways.
It's not respective to the specific Android devices.
Please check this out: Stackoverflow
Just a note, it can also be done like this (but it has less browsers support)
More info: https://developer.mozilla.org/es/docs/Web/API/KeyboardEvent/getModifierState