TIP게시판

제목 oninput + substring 버그
글쓴이 배강민 작성시각 2018/05/29 11:27:50
댓글 : 1 추천 : 1 스크랩 : 0 조회수 : 12079   RSS
배강민

모바일 프론트를 하다보니 신기한 놈들이 많이 발견되네요.

일단 oninput을 처음 보신다면 https://www.w3schools.com/jsref/event_oninput.asp 참고

검색어 자동완성 형식의 서비스를 위해 키 이벤트 발생시마다 Ajax통신을 할때

Firefox에서는 한글 입력을 keyup등으로는 인식을 못하는 문제가 있는데 이때에 oninput을 사용하곤 하죠.

그런데 oninput으로 값의 변화를 체크하게 하고서 substring으로 자르게하니 일부 브라우저에서

한글의 경우 자음/모음 분리 현상이 발생하네요.

예를 들어 "가가가"를 입력하면 "ㄱㅏㄱㅏㄱㅏ"로 분리가 되어버립니다.

일단 안드로이드 6, 7, 8의 기본 브라우저에서 현상이 발견되었고, 해보니까 PC IE 11에서도 발생하네요.

안드로이드에 설치한 크롬과 Webview도 정상이고요.

샘플 : https://jsfiddle.net/qgkzwmoh/3/

jQuery의 문제는 아닙니다. pure로 해봐도 동일하네요.관련 정보를 찾아보려했지만 나오질 않네요.

일단 oninput + substring 같이 사용하지 않는 쪽으로~

 다음글 아이폰의 스마트 구두점에 따른 대응
 이전글 신기한 textarea 버그 (크롬+a?) (1)

댓글

한대승(불의회상) / 2018/05/29 12:57:59 / 추천 0

좋은 정보 감사합니다.

oninput 사용시 참고해야겠습니다.