Javascript input한글차단

Question

안녕하세요 혹시 js에서 input에 한글을 입력 못하게 하는 방법이 있을까요?Onbefore,keydown,composingstart,oninput모두 이벤트를 막아도 소용이 없습니다 그래서 일단 넣고oninput핸들러에서 value에 들어온 값이 한글이면 한글만 지우고 다시 value에 넣었더니, 안드로이드나 브라우저에 따라서 어떤경우에는 한글입력시 value가 복사되는 버그가 발생하였습니다. Requestanimation으로 미뤄서 한 타임 뒤에 value를 지우니 한글자씩 입력하면 그런 복사 버그는 안 일어났는데요 대신 동시에 한글을 여러개 입력하거나 빠르게 연타하니 다시 복사 버그가 일어납니다. 브라우저나 안드로이드 기종에 따라 정상적일때도 있고 복사버그가 있을때도 있습니다 oninput에 또 한글입력시 input 값은 한글 없는 상태로 보이나 backspace를 누르면 보이지 않는 버퍼 같은곳에 저장된 한글을 지우고 나서 그 다음 value를 지우는것 같아요 그래서 화면을 보면 지우는키를 눌러도 두번눌러야 그때부터 지워집니다 ime 한글 조합때문인거 같은데요 혹시 stopevent처럼 아예 이벤트를 막는 방법이 있을까요?

yamanin · Answer

https://hooeni.tistory.com/160이게 작동하나 모르겠어요. 확인해보세요.

kimhwanhoon · Answer

값을 변수로 선언하시고 onChange 사용하셔서, regex로 한글일때 랜더링이 안되게 하시면됩니다.

정규분포 · Answer

CJK 문자는 composition 문제 때문에 아무리 이벤트헨들러에서 막아보려 해봤자 그대로 통과됨니다. 한 OS에서 된다 해도 다른 리눅스나 맥이나 모바일에서 된다는 보장 없음. W3C에서도 문제라고 지적해서 지금 고쳐지고 있는 사항임.똑 뿌러지는 방법 없습니다. 이 질문하는 분 님이 처음이 아니고, 저도 과거에 개인적으로 해결해 보려하고 자료를 찾아보니 그런 결론을 내렸음. 사용자가 입력 다 하면 에러를 표시하고 값을 수용하지 않는 방법 밖에는 없음.한 3년만 더 있으면 이벤트 구조가 개선되지 않을 까 싶습니다. 그때까진 어쩔 수 없음... 윗선 요구사항이면 뭐, 못한다고 배 째라 하세요.

핸호 · Answer

윗분 말이 맞습니다. 저도 한때 비슷한 문제로 개고생했는데, IME Composition 문제는 브라우저 뿐만 아니라 OS 버전마다도 모두 제각각입니다. 가장 좋은 방법은 인풋을 강제로 막는게 아니라, 잘못된 내용이 입력된 경우 에러메시지를 띄우는 겁니다. Google Material Design의 인풋 컴포넌트에서 그렇게 가이드하는 이유가 있습니다.

Javascript input한글차단

4개의 답변

Q&A 목록