반응형
자바스크립트 키코드(event.keyCode)를 이용한 입력 제한하는 방법을 몇 가지 예제를 통해 알아보자
1. 한글 입력 방지 스크립트 - submit 에서 Form Validation 시
for(i=0;i<mainform.FRM_BID.value.length;i++) {
var a=mainform.FRM_BID.value.charCodeAt(i);
if (a > 128) {
alert('영문으로만 입력해주세요!');
mainform.FRM_BID.value = "";
mainform.FRM_BID.focus();
return;
}
}
2. 특수문자(Special Character) 입력 방지 스크립트 - key down 시 사용
if ((event.keyCode > 32 && event.keyCode < 48) || (event.keyCode > 57 && event.keyCode < 65) || (event.keyCode > 90 && event.keyCode < 97) || event.keyCode == 34 || event.keyCode == 39){
event.returnValue = false;
}
//keyCode 34,39 는 따옴표
3. 특수문자(Special Character) 입력 방지 스크립트 - submit 에서 Form Validation 시
function scCheck(tmp){
for(i = 0 ; i < tmp.length; i++){
ch = tmp.charCodeAt(i);
if( ch < 48 || (ch > 57 && ch < 65) || (ch > 90 && ch < 97) || (ch > 122 && ch < 44032) || ch > 55023 ){
if(ch != 45 && ch != 95){
return false;
}
}
}
}
scCheck(id.value);
[참고] 키코드 전체 리스트
키코드를 이용해서 화면을 제어할 필요가 있을 경우 참고.
키 | 코드 | 키 | 코드 | 키 | 코드 | 키 | 코드 |
←(백스페이스) | 8 | 0 | 48 | A | 65 | F1 | 112 |
TAB | 9 | 1 | 49 | B | 66 | F2 | 113 |
ENTER | 13 | 2 | 50 | C | 67 | F3 | 114 |
SHIFT | 16 | 3 | 51 | D | 68 | F4 | 115 |
CTRL | 17 | 4 | 52 | E | 69 | F5 | 116 |
ALT | 18 | 5 | 53 | F | 70 | F6 | 117 |
PAUSE/BREAK | 19 | 6 | 54 | G | 71 | F7 | 118 |
CAPS LOOK | 20 | 7 | 55 | H | 72 | F8 | 119 |
한/영 | 21 | 8 | 56 | I | 73 | F9 | 120 |
한자 | 25 | 9 | 57 | J | 74 | F10 | 121 |
ESC | 27 | K | 75 | F11 | 122 | ||
스페이스 | 32 | 0(오른쪽) | 96 | L | 76 | F12 | 123 |
PAGE UP | 33 | 1(오른쪽) | 97 | M | 77 | ||
PAGE DN | 34 | 2(오른쪽) | 98 | N | 78 | ||
END | 35 | 3(오른쪽) | 99 | O | 79 | ||
HOME | 36 | 4(오른쪽) | 100 | P | 80 | ||
←(중간) | 37 | 5(오른쪽) | 101 | Q | 81 | =(중간) | 187 |
↑(중간) | 38 | 6(오른쪽) | 102 | R | 82 | -(중간) | 189 |
→(중간) | 39 | 7(오른쪽) | 103 | S | 83 | `(왼쪽콤마) | 192 |
↓(중간) | 40 | 8(오른쪽) | 104 | T | 84 | \(중간) | 220 |
INSERT | 45 | 9(오른쪽) | 105 | U | 85 | ||
DELETE | 46 | V | 86 | .(오른쪽) | 110 | ||
윈도우(왼쪽) | 91 | W | 87 | /(오른쪽) | 111 | ||
윈도우(오른쪽) | 92 | X | 88 | *(오른쪽) | 106 | ||
기능키 | 93 | Y | 89 | +(오른쪽) | 107 | ||
NUM LOCK | 144 | Z | 90 | -(오른쪽) | 109 | ||
SCROLL LOCK | 145 |
반응형
'개발 기록 > Javascript' 카테고리의 다른 글
SVG 움직이는 화살표 with yarrow.js - 예제 소스코드 (0) | 2023.06.06 |
---|---|
[Javascript] 정규식 공백 제거, 사업자 번호 검증, 숫자를 한글 금액으로 (0) | 2023.05.23 |
[Javascript] 페이징 소스코드 - jQuery, Ajax, and Bootstrap5 (0) | 2023.05.22 |
[Javascript] 팝업창 만들기 - Window.open() (0) | 2023.05.11 |
[Javascript] 프레임을 넘나드는 팝업 레이어: createPopup() (0) | 2023.05.10 |