Post

채팅창에서 한글 입력시에 enter키 누르면 마지막 문자 두번 입력되는 상황

keydown 이벤트 오류

이유 : 한글 입력 시 마지막 글자가 두 번 입력되는 문제는 keydown 이벤트가 조합 중인 문자를 처리하기 때문이다. 이를 해결하기 위해 KeyboardEvent.isComposing 속성을 사용하여 조합 중인 문자가 아닌 경우에만 메시지를 전송하도록 할 수 있다.

1
2
3
4
5
6
7
        // Enter 키를 눌러 메시지를 전송하는 함수
        document.getElementById('content').addEventListener('keydown', function(event) {
            if (event.key === 'Enter' && !event.shiftKey && !event.isComposing) {
                event.preventDefault(); // 기본 Enter 키 동작(줄 바꿈)을 방지
                setTimeout(sendMessage, 0); // 메시지 전송 함수 호출을 약간 지연
            }
        });

출처

This post is licensed under CC BY 4.0 by the author.