jquery keyup 질문드립니다.

jquery keyup 질문드립니다.

QA

jquery keyup 질문드립니다.

본문

안녕하세요.

textarea가

1 댓글

 

1 답글

2 답글

3 답글

이 있으면 1 댓글과 1 답글은 keyup이 잘 작동하는데

2 답글, 3 답글은 keyup이 작동하지 않습니다.

alert('a') 까지도 안오네요 1댓글, 1답글만 작동하네요.

원인을 알수 있을까요?

감사합니다.

 


<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<div id="u_cbox_write_wrap">
1 댓글
<textarea title="댓글" id="cbox_module__write_textarea" class="u_cbox_text" rows="3" cols="30" data-log="RPC.input"></textarea>
<span>현재 입력한 글자수</span><strong class="u_cbox_count_num">0</strong>
</div>
 
<div id="u_cbox_write_wrap_reply">
1 답글
<textarea title="답글" id="cbox_module__reply_textarea" class="u_cbox_text" rows="3" cols="30" data-log="RPC.input"></textarea>
<span>현재 입력한 글자수</span><strong class="u_cbox_count_num">0</strong>
</div>

<div id="u_cbox_write_wrap_reply">
2 답글
<textarea title="답글" id="cbox_module__reply_textarea" class="u_cbox_text" rows="3" cols="30" data-log="RPC.input"></textarea>
<span>현재 입력한 글자수</span><strong class="u_cbox_count_num">0</strong>
</div>
 
<div id="u_cbox_write_wrap_reply">
3 답글
<textarea title="답글" id="cbox_module__reply_textarea" class="u_cbox_text" rows="3" cols="30" data-log="RPC.input"></textarea>
<span>현재 입력한 글자수</span><strong class="u_cbox_count_num">0</strong>
</div>
<script>
// 댓글 글자수 제한
    var limit_count    = 5;
    $('#cbox_module__write_textarea').on('keyup', function() {
        if($(this).val().length > limit_count) {
            $(this).val($(this).val().substring(0, limit_count));
            $('#u_cbox_write_wrap .u_cbox_count_num').text($(this).val().length);
            alert(limit_count + '자리 이상 입력하실수 없습니다.');
            return false;
        } else {
            $('#u_cbox_write_wrap .u_cbox_count_num').text($(this).val().length);
        }
    });
 
    // 답글 글자수 제한
    $('#cbox_module__reply_textarea').on('keyup', function() {
       alert('a');
        if($(this).val().length > limit_count) {
            $(this).val($(this).val().substring(0, limit_count));
            $(this).find('#u_cbox_write_wrap_reply .u_cbox_count_num').text($(this).find('.u_cbox_count_num').val().length);
            alert(limit_count + '자리 이상 입력하실수 없습니다.');
            return false;
        } else {
            $(this).find('#u_cbox_write_wrap_reply .u_cbox_count_num').text($(this).find('.u_cbox_count_num').val().length);
        }
    });
</script>
 

이 질문에 댓글 쓰기 :

답변 1

div 의 id 값이 동일한게 여러개라 못찾아서 그런거같습니다. 

 

아래 처럼 수정해봤어요 원하시는게 맞을가요? ㅎ

 

id 값들은 필요가 없어보임니다

 


    <script src="http://code.jquery.com/jquery-latest.min.js"></script>
    <div id="u_cbox_write_wrap" class="u_cbox_wrap">
    1 댓글
    <textarea title="댓글" id="cbox_module__write_textarea" class="u_cbox_text" rows="3" cols="30" data-log="RPC.input"></textarea>
    <span>현재 입력한 글자수</span><strong class="u_cbox_count_num">0</strong>
    </div>
     
    <div id="u_cbox_write_wrap_reply" class="u_cbox_wrap">
    1 답글
    <textarea title="답글" id="cbox_module__reply_textarea" class="u_cbox_text" rows="3" cols="30" data-log="RPC.input"></textarea>
    <span>현재 입력한 글자수</span><strong class="u_cbox_count_num">0</strong>
    </div>
   
    <div id="u_cbox_write_wrap_reply" class="u_cbox_wrap">
    2 답글
    <textarea title="답글" id="cbox_module__reply_textarea" class="u_cbox_text" rows="3" cols="30" data-log="RPC.input"></textarea>
    <span>현재 입력한 글자수</span><strong class="u_cbox_count_num">0</strong>
    </div>
 
    <div id="u_cbox_write_wrap_reply" class="u_cbox_wrap">
    3 답글
    <textarea title="답글" id="cbox_module__reply_textarea" class="u_cbox_text" rows="3" cols="30" data-log="RPC.input"></textarea>
    <span>현재 입력한 글자수</span><strong class="u_cbox_count_num">0</strong>
    </div>
    <script>
    // 댓글 글자수 제한
        var limit_count    = 5;
        $('.u_cbox_text').on('keyup', function() {
            if($(this).val().length > limit_count) {
                $(this).val($(this).val().substring(0, limit_count));
                $(this).closest('.u_cbox_wrap').find('.u_cbox_count_num').text($(this).val().length);
                alert(limit_count + '자리 이상 입력하실수 없습니다.');
                return false;
            } else {
                $(this).closest('.u_cbox_wrap').find('.u_cbox_count_num').text($(this).val().length);
            }
        });
     
    </script>

 

 

아래처럼 수정해도 될듯해보임


    // 댓글 글자수 제한
    var limit_count = 5;
    $('.u_cbox_text').on('keyup', function() {
        var $this = $(this); // 현재 textarea 요소를 jQuery 객체로 저장
 
        // 입력값을 최대 글자 수까지 자르고 textarea에 설정
        if ($this.val().length > limit_count) {
            $this.val($this.val().substring(0, limit_count));
            alert(limit_count + '자리 이상 입력하실 수 없습니다.');
        }
       
        // u_cbox_wrap 클래스를 가진 부모 요소에서 u_cbox_count_num 클래스를 가진 요소를 찾아 업데이트
        $this.closest('.u_cbox_wrap').find('.u_cbox_count_num').text($this.val().length);
    });
 

 

답변을 작성하시기 전에 로그인 해주세요.
전체 2,660
QA 내용 검색

회원로그인

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