[JavaScript] 글자 수 입력 제한 처리(바이트)

참고:

https://yangyag.tistory.com/438

[javascript] 글자수 제한 처리(바이트)

 

https://fairworld.tistory.com/107

[자바스크립트] escape()와 unescape()

 

 

function ChkByte(obj){

  var maxByte = 3000;        //최대 입력 바이트 수

  var str = obj.value;        //해당 객체의 값을 str 변수에 담는다. 여기서는 문자열이 넘어온다.

  var str_len = str.length;       //넘어온 객체(문자열)의 길이를 str_len에 담는다.

 

  var rbyte = 0;

  var rlen = 0;

  var one_char = "";

  var str2 = "";

 

  for(var i =0; i<str_len; i++){      //입력한 문자열의 길이만큼 반복한다.

    one_char = str.charAt(i);        //입력한 문자열을 순차적으로 char형으로 바꿔서 문자 하나씩 one_char에 담는다.

    

    if(escape(one_char).length > 4){        //하나씩 읽어온 char형을 escape(인코딩) 시켜서 4보다 큰지

      rbyte += 2;            //escape(인코딩) 결과의 길이가 4보다 크면 한글이므로 2byte이다. 그래서 rbyte에 2를 추가

    } else {

      rbyte ++;        //영문 등 나머지는 1byte

    }

 

    if(rbyte <= maxByte) {    //글자 하나당 몇바이트인지 체크해서

                                        //모두 더한 rbyte값이 최대 입력바이트 수(maxByte) 보다 작거나 같으면 실행

      rlen = i + 1;      //return 할 문자열 개수

    }

  }    

 

  if(rbyte > maxByte){     //전체 몇바이트 입력했는지 담겨있는 rbyte 값이 최대 입력 바이트 maxByte값 보다 크면

    alert("한글 " + (maxByte/2)+ "자/ 영문 " +maxByte+ "자를 초과 입력할 수 없습니다.");

    str2 = str.substr(0, rlen);          // 0번째 인덱스 부터 rlen 길이 만큼 잘라서 str2에 담는다.

    obj.value = str2;        //문자열 입력 객체에 최대입력 바이트만큼 잘라낸 문자열을 다시 저장한다.

    ChkByte(obj, maxByte);    

  } else{

      document.getElementById('byteInfo').innerText = rbyte; 

  }

}