input 요소를 초기화 하려는데 문제가 생겼어요

Question

document.getElementById('input의 id').value &#61;null;로 input요소의 값을 초기화했을때 예를들어 '값', '낚'처럼 추가로 키 입력이 있어도 글자가 변하지 않는경우에는 문제가 없는데'가','나' 처럼 추가로 키 입력이 있을때 받침에 들어가는 경우 글자가 살아 나네요input 요소에 입력된 값이 '가' 일 경우에 document.getElementById('input의 id').value를 null로 하면 입력값이 지워졌다가도 키보드로 'ㄷ'만 입력해도 '갇' 이 되버리는 식이에요 왜 초기화된 값이 살아나는거고 살아나지 않게 하려면 어떻게 해결해야 하나요?

캐티 · Accepted Answer

자바스크립트에서 ime 조합을 초기화 하는 명령어가 없으므로 새로운 input 태그를 넣고 포커스를 주고 지난 input 태그를 삭제하는 방식이 적절해요.

가ten거리 · Answer

코드를 어떻게 짜셨는지 확인이 필요할 것 같습니다.단순히 input 에서의 문제보다는 이전에 입력했던 데이터를 저장해 불러오는 변수가 따로 있으신 건 아닌가요?

핸호 · Answer

입력 상황에 따라 브라우저의 IME composition 문제일 수 있는데, 한글에서만 그런 현상이 있는지 확인해보시고, 만약 그렇다면, focus-out -> set null > 다시 focus-in을 시켜주면 workaround로 해결은 됩니다.원인은 브라우저 또는 운영체제에서 한글을 입력할때 자음과 모음을 분리해서 인식(ㄱ,ㅏ,ㄴ,ㅏ)하는게 아니라, 하나의 글자 단위("가","나")로 인식하는데, 작성자님이 만드신 코드가 아직 컴포징이 완료되지 않은 글자(즉 아직 작성중이라고 인식되는 글자)에 강제로 변화를 주었기 때문에 충돌이 일어나는겁니다. focus-out이 되면 브라우저는 컴포징이 완료되었다고 인식하기 때문에 해결이 되는거고요.

input 요소를 초기화 하려는데 문제가 생겼어요

3개의 답변

#input 목록