테스트 사이트 - 개발 중인 베타 버전입니다

textarea 글자수 나오는 소스를 바이트수로 바꿀수 있을까요? 채택완료

smltree 1년 전 조회 2,156

아래 소스는 textarea에 글씨를 쓰면 글자수가 나오는 소스입니다.
작동은 잘 하고 있습니다.
이것을 글자수가 아니라 바이트수로 바꿀수 있을까요?
도움 주시면 감사하겠습니다.

 

</p>

<p>    <div class="text_box2"></p>

<p> <p class="txt">글자수를 나타냅니다.<div class="count"><span>0</span>/3000</div></p>

      <textarea name="wr_content" id="wr_content"  rows="25" style="width:250px"></textarea>

                                    <script>

                                    $('.text_box2 textarea').keyup(function(){

                                      var content = $(this).val();

                                      $('.text_box2 .count span').html(content.length);

                                      if (content.length > 3000){

                                        alert("최대 3000자까지 입력 가능합니다.");

                                        $(this).val(content.substring(0, 3000));

                                        $('.text_box2 .count span').html(3000);

                                      }

                                    });

                                    </script>

            </div></p>

<p>

댓글을 작성하려면 로그인이 필요합니다.

답변 1개

채택된 답변
+20 포인트
1년 전

function getByteLength(str) {
            let byteLength = 0;
            for (let i = 0; i < str.length; i++) {
                const charCode = str.charCodeAt(i);
                if (charCode <= 0x007F) {
                    byteLength += 1; // 아스키 문자는 1바이트
                } else if (charCode <= 0x07FF) {
                    byteLength += 2; // 2바이트 문자
                } else {
                    byteLength += 3; // 3바이트 문자 (한글 등)
                }
            }
            return byteLength;
        }

        $('#wr_content').keyup(function () {
            const content = $(this).val();
            const byteLength = getByteLength(content);
            $('.text_box2 .count span').html(byteLength);
            if (byteLength > 3000) {
                alert("최대 3000바이트까지 입력 가능합니다.");
                // 입력을 3000바이트로 제한
                let trimmedContent = content;
                while (getByteLength(trimmedContent) > 3000) {
                    trimmedContent = trimmedContent.substring(0, trimmedContent.length - 1);
                }
                $(this).val(trimmedContent);
                $('.text_box2 .count span').html(getByteLength(trimmedContent));
            }
        });

로그인 후 평가할 수 있습니다

댓글을 작성하려면 로그인이 필요합니다.

답변을 작성하려면 로그인이 필요합니다.

로그인