[JQuery] 입력창 숫자만 입력

입력창에 숫자만 입력되기 원할 때 type을 number, tel로 하면 될 거라고 생각하겠지만, 웹에서나 모바일에서 문자가 입력되는 경우가 있다.

 

이러한 경우를 방지하기 위해 스크립트에서 입력값이 숫자가 아닐 경우 해당 문자를 공백으로 치환하는 방법을 써야 한다.

 

<input type="text" onKeyup="$(this).val($(this).val().replace(/[^0-9]/gi, ''));"/>

input태그에 onkeyup 이벤트로 적용할 수 있다.

하지만 각 입력창에 일일이 keyup이벤트를 적용하는 것은 비효율적이다.

 

$("input[type=number], input[type=tel]").filter(".num").on("keyup", function(){     $(this).val($(this).val().replace(/[^0-9]g, "")); });

공통스크립트로 위 소스와 같은 이벤트를 기호에 맞게 설정해주면 될 것이다.

type이 number 또는 tel로 되어 있는 input태그에 "num"이라는 클래스만 추가하면 자동적으로 숫자만 입력 가능할 것이다.