input에 숫자만 입력받기 (최종판을 위해…)

숫자만 입력받는 방법은 무수히 많다.

숫자외 문자를 입력하면 글이 안써지게 하는 코드 (아쉽게 한글은 완성형으로 해당이 안된다.)
css로 ime-mode 를 disabled 해서 한글은 안써지게 하는 코드 (아쉽게 크롬은 반응이 없다.)
또 어렵사리 만들어 놓으니 초성만 쓰고 탭을 눌러 이동하면 그 초성이 input칸에 남아있다.

등등 수 많은 팁들이 있지만 우리나라 한글도 못쓰게하고 숫자만 쓰게 하려면 좀 힘들다.

그래서 여기저기 코드를 빌려다가 만들었다.

var validCheck = {
    keyDown : function (e) {
        var key;
        if(window.event)
            key = window.event.keyCode; //IE
        else
            key = e.which; //firefox
        var event;
        if (key == 0 || key == 8 || key == 46 || key == 9){
            event = e || window.event;
            if (typeof event.stopPropagation != "undefined") {
                event.stopPropagation();
            } else {
                event.cancelBubble = true;
            }   
            return;
        }
        if (key < 48 || (key > 57 && key < 96) || key > 105 || e.shiftKey) {
            e.preventDefault ? e.preventDefault() : e.returnValue = false;
        }
    },        
    keyUp : function (e) {
        var key;
        if(window.event)
            key = window.event.keyCode; //IE
        else
            key = e.which; //firefox
        var event;
        event = e || window.event;        
        if ( key == 8 || key == 46 || key == 37 || key == 39 ) 
            return;
        else
            event.target.value = event.target.value.replace(/[^0-9]/g, "");
    },
    focusOut : function (ele) {
        ele.val(ele.val().replace(/[^0-9]/g, ""));
    }
};
//이렇게 함수를 써주고 아래처럼 사용한다.


$('input.phonenumber').css("ime-mode", "disabled").keydown( function(e) {
    validCheck.keyDown(e);
}).keyup( function(e){
    validCheck.keyUp(e);
}).focusout( function(e){        
    validCheck.focusOut($(this));
});

위 처럼 스크립트에 사용하면 phonenumber 클래스가 적용된 모든 input에 숫자를 제외한 영어/한글/특수문자 등이 입력되지 않는다. (라고 일단 테스트 해본 결과이다.)

TOP