상세 컨텐츠

본문 제목

textarea 입력한 한/영 byte 자르기

프로그래밍

by 2hansoul 2021. 11. 19. 18:02

본문

반응형
<!--메세지 byte제한-->
<script type="text/javascript">
function textbyte(obj, maxByte){
var str = obj.value;       //실시간으로 입력한 text값
var str_len = str.length;  //위 변수에서 입력한 값 길이 확인하기 위해

var rbyte = 0;                  //입력한 text 값
var rlen = 0;           //90 or 2000 값 제한 걸어놓기 위해 설정
var one_char = "";
var str2 = "";

//문자 byte 계산
for(var i=0; i<str_len; i++){
one_char = str.charAt(i);                                                               /*str.charAt(0) str가리키고 잇는 문자열에서 0번째 문자를 char타입으로 변환 String으로 저장된 문자열 중에서 한 글자만 선택해서 char타입으로 변환
																							[사용자가 입력을 한글자만 하는 경우는 거의 없기때문에 문자열로 입력을 받아준다]*/
if(escape(one_char).length > 4){                        //one_char 변환한 문자를 escape(유니코드로 변환해줘서 문자를 판단하게 해줌)  1byte=%XX / 2byte=%uXXXX  변환한 문자가 >4 크면 2byte 한글로 판단
    rbyte += 2;
        console.log(rbyte);                              //출력해보면 입력한 문자 가장 마지막이 찍힌다 ex)이한솔 = 솔
		console.log(byteInfo);
}else{
    rbyte++;                                            //영문 등 나머지 1Byte
}

if(rbyte <= maxByte){                                   //maxbyte보다 rbyte가 높으면 rlen변수에 저장 하고 문자열 자르는데 이용
    rlen = i+1;
}
}//for

//문자열 자르기
if(rbyte > maxByte){
    alert("한글 "+(maxByte/2)+"자 / 영문 "+maxByte+"자를 초과 입력할 수 없습니다.");
    str2 = str.substr(0,rlen);               //substr (추출대상문자열 , 추출할 문자 개수)
    obj.value = str2;                        //자르고 남은 문자열(실질적으로 입력완료된 문자열)
        console.log(str2);
    textbyte(obj, maxByte);                  //textbyte함수에 파라미터 넣어준다

}else{
    document.getElementById("byteInfo").innerText = rbyte;          //getElementById 메서드는 주어진 문자열과 일치하는 id 속성을 가진 요소를 찾고, 이를 나타내는 Element 객체를 반환합니다
                                                                                                                                        //innerText 불필요한 공백을 제거 하고 출력해줌
}
}//textbyte
</script>

 

<textarea style="resize : none;"  rows="10"  cols="50"  name="sms"  id="sms"  onKeyup="javascript:textbyte(this,90)" placeholder="단문"></textarea>
<span id="byteInfo">0</span>/90Byte

getElementById 잡아준 id 값에 맞게 출력을 시켜준다 

 

반응형

'프로그래밍' 카테고리의 다른 글

linux centos7 한글깨짐  (0) 2022.01.04
input type="text" readonly/disabled  (0) 2021.12.14
Linux passwd 변경  (0) 2021.11.03
WARNING: REMOTE HOST IDENTIFICATION HAS CHANGED!  (0) 2021.11.02
[PHP] 정규식 preg_match  (0) 2021.09.24

관련글 더보기

댓글 영역