대문자로 입력해 비밀번호가 틀렸다는 메시지를 볼 때가 있다
이럴 때에 아래와 같은 스크립트를 활용하여 Caps Lock 키가 눌려 있는 것이 아닌지 확인해주는 코드를 이용하면 좋지 않을까 생각한다.
아래의 코드는 사이트에 적용되어 있는 코드부분을 스크랩해온 내용이기 때문에 자신의 사이트에 적용하기 위해 조금의 손질을 해야 할 것이다.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE>Caps Lock Message</TITLE>
<script type="text/javascript">
function fnKeyPress(e)
{
var keyCode = 0;
var shiftKey = false;
keyCode = e.keyCode;
shiftKey = e.shiftKey;
if ((keyCode >= 65 && keyCode <= 90) && !shiftKey)
fnShowCapsLockMsg();
else
fnHiddenCapsLockMsg();
}
function fnKeyDown(e)
{
var keyCode = 0;
keyCode = e.keyCode;
if (keyCode == 20)
fnHiddenCapsLockMsg();
}
function fnShowCapsLockMsg()
{
var divCapsLock = document.getElementById("CapsLock");
divCapsLock.style.pixelTop = (document.body.clientHeight / 2) - (154 / 2);
divCapsLock.style.pixelLeft = (document.body.clientWidth / 2) - (502 / 2);
divCapsLock.style.display = "block";
}
function fnHiddenCapsLockMsg()
{
var divCapsLock = document.getElementById("CapsLock");
divCapsLock.style.pixelTop = -154;
divCapsLock.style.pixelLeft = -502;
divCapsLock.style.display = "none";
}
</script>
</HEAD><BODY>
<DIV ID="SomeForm">
<FORM NAME="Form1" ID="Form1">
<INPUT TYPE="TEXT" NAME="SomeText" ID="SomeText" VALUE="" SIZE="20" ONKEYPRESS="javascript:fnKeyPress(event);" ONKEYDOWN="javascript:fnKeyDown(event);" />
</FORM>
</DIV>
<DIV ID="CapsLock" STYLE="display:none;">CapsLock 키가 눌려있습니다.</DIV>
</BODY>
</HTML>
'Web > JavaScript' 카테고리의 다른 글
| Javascript 를 이용하기 쉽게 정리된 메소드, 이벤트, XHR 등 정리 목록 (0) | 2008/01/10 |
|---|---|
| QueryString 공백, 특수문자 자바스크립트 처리 (0) | 2007/12/05 |
| JavaScript Caps Lock (1) | 2007/11/15 |
| Javascript - 간단한 DownLoad 스크립트 (0) | 2007/11/05 |
| Javascript window.showModalDialog() (0) | 2007/11/03 |
| Window size and scrolling (0) | 2007/09/18 |
Trackback : http://i-ruru.com/trackback/190
-
Fivestar 2008/10/15 11:41
간단한 소스인데 유용하다. ^^
Prev
