본문 바로가기

개발/Java Script

[Tip] input type="text" 에 대문자 입력 방법

http://gudle.net/133 에서 퍼옴


1. onkeypress 이벤트에서 event.keyCode 값을 변경


function fnUppercase() {

var event = window.event;

if(event.keyCode >= 97 && event.keyCode <= 122) {

event.keyCode = event.keyCode - 32;

}

}


단점 : 이 방법은 copy & paste 에서는 동작하지 않음


2. onpaste 이벤트를 위해 clipboardData 데이터를 변경


<input type="text" name="text2" maxlength="15" onkeypress="fnUppercase();" onpaste="fnPaste();">


function fnPaste() {

var str = window.clipboardData.getData("Text");

window.clipboardData.setData("Text", str.toUpperCase());

}


단점 : clipboardData 를 대문자로 변환하기 때문에 원래 데이터를 유지할 수 없음


3. STYLE 의 text-transform 속성을 uppercase 로 변경

<input type="text" name="text3" maxlength="15" style="text-transform: uppercase;">


단점 : 입력 시 대문자로 보이나 실제 값을 찍으면 소문자이다. 서버로 전송 시도 소문자로 전송