글자 수를 실시간으로 체크하고 싶습니다
본문
keyup 이벤트를 사용하면 키를 길게 누르고 있을 때
제대로 카운팅이 되지 않는 문제가 있습니다. 반면에
keydown 이벤트로 바꾸면 첫 글자가 카운팅되지 않는 문제가 있습니다.
예를 들어, 입력 필드가 비어 있을 때 'a'를 입력하면 여전히 0 / 100으로 표시되고, 'ab'를 입력하면 1 / 100으로 표시됩니다.
글자를 지울 때도 마찬가지로 실제 글자 수와 카운트 차이가 납니다.
키를 계속 누르고 있어도 정확한 글자 수를 카운팅하려면 어떻게 해야 할까요?
답변 2
input이벤트를 사용하시면 됩니다.
<textarea id="text" rows="4" cols="50"></textarea>
<div id="count">0 / 100</div>
<script>
document.addEventListener('DOMContentLoaded', function() {
var textInput = document.getElementById('text');
var count = document.getElementById('count');
textInput.addEventListener('input', function() {
var textLength = this.value.length;
count.textContent = textLength + ' / 100';
});
});
</script>
oninput 이벤트로 하시면 되실듯 합니다.
답변을 작성하시기 전에 로그인 해주세요.