설명

조건

오로지 숫자키만 입력되어야됨

숫자외의 키가 입력된 후에 지워지는거 최대한 방지

IE8까지 지원

only javascript만 활용

기법

ime-mode:disabled 속성 사용

• 한글 키보드 입력 방지하는 역할
• ms와 moz에서만 적용됨
• 크롬에선 적용 안됨
• 크롬을 위한 js식이 필요함 (하지만 ime-mode:disabled처럼 완벽하진 않음)

keycode 사용

• 각 key마다 code값이 존재, 그 값을 이용해 눌려도되는 키와 눌리지 말아야될 키를 나눔
• 눌리지 말아야할 키가 눌렸을 때 event 발생을 막아버림 (하지만 크롬에선 한글은 한계가 있음)

해당 이벤트가 존재하는 안하는지 if문을 활용한 구분

• IE8까지 대응하기 위함

한계

PC 크롬에서 한글키보드는 keycode값이 229로 반환, 229로 반환되었을 때 event를 막는식이 작동하지 않음

• 즉 한글이 입력되었다가 지워지는 현상 발생

아이폰 X IOS 12.4.1 테스트 결과 숫자가 1~3개 입력된 상황에서 한글을 마구 연타하면 숫자까지 지워지는 현상 발생

• 정규식으로 한글 입력시 자동으로 지워지게하는 식을 넣었는데 아무래도 그 식이 실행되면서 오류가 발생하는 듯

PC 크롬, 갤럭시노트5 안드로이드 7.0 한글키를 마구 입력한 후 백스페이스를 누르면 한번에서 두번 누르고나서 그 다음에 눌러야 지워지는 현상 발생

파이어폭스와 IE8+에선 큰 오류없음, ime-mode:disabled 덕분인듯