글자 수를 실시간으로 체크하고 싶습니다

글자 수를 실시간으로 체크하고 싶습니다

QA

글자 수를 실시간으로 체크하고 싶습니다

본문

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>
답변을 작성하시기 전에 로그인 해주세요.
전체 2,086
QA 내용 검색
filter #css ×

회원로그인

(주)에스아이알소프트 / 대표:홍석명 / (06211) 서울특별시 강남구 역삼동 707-34 한신인터밸리24 서관 1404호 / E-Mail: admin@sir.kr
사업자등록번호: 217-81-36347 / 통신판매업신고번호:2014-서울강남-02098호 / 개인정보보호책임자:김민섭(minsup@sir.kr)
© SIRSOFT