메인
기술
메인
기술
무료게임
잡담
자유
개인
일정
갤러리
회원가입
계정 찾기
로그인
HOME
기술
입력 글자바이트 제한 textarea,textbox용
목록
작성자
mins
작성 : 2006-12-19 17:52
조회 : 415
지남
1일간
2006-12-19
-
2006-12-19
좌표
첨부된 파일이 없습니다.
#javascript
<script> //================================================================ // 문자열 바이트 알아내기 //================================================================ function cm_get_byte(str) { //문자열의 byte 길이를 알아냄(한글 2byte로 처리) var i,m=str.length, re_count=0,val = 0;; for(i=0;i<m;i++) { val = escape(str.charAt(i)).length; if(val>3) re_count++; re_count++; } return re_count; } function cm_get_byte_length(str,limit_byte){ //지정된 바이트 길이만큼의 length를 반환, 홀수로 짤리면 -1의 길이반환 var i,m=str.length, re_count=0,val = 0;; var len_count = 0; for(i=0;re_count<limit_byte ;i++) { val = escape(str.charAt(i)).length; len_count++; if(val>3) re_count++; re_count++; } if(re_count%2 == 1) return (len_count-1); else return (len_count); } //================================================================ // 입력 글자바이트 제한 (필수 : 문자열 바이트 알아내기) // textarea에 사용 //================================================================ function input_textarea_limit_byte(ta,limit){ var layout = document.createElement('table'); // layout.border='2'; layout.style.padding='0px'; layout.style.margin='0px'; if(ta &&ta.style && ta.style.width){ layout.style.width=ta.style.width } layout.border="0"; layout.cellspacing="0"; layout.cellpadding="0"; var tr1 = layout.insertRow(-1); var td1 = tr1.insertCell(-1); td1.style.padding='0px'; td1.style.textAlign='right'; var tr2 = layout.insertRow(-1); var td2 = tr2.insertCell(-1); td2.style.padding='0px'; td2.style.textAlign='right'; var txt_limit = document.createElement('input'); txt_limit.type='text'; txt_limit.style.borderStyle='none'; txt_limit.style.textAlign='right'; txt_limit.style.fontSize='10px'; txt_limit.style.width='40px'; txt_limit.readOnly=true; txt_limit.value=0; var span_text1 = document.createElement('span'); span_text1.innerHTML='Limit : '; var span_text2 = document.createElement('span'); if(limit){ span_text2.innerHTML=' byte /'+limit+' byte'; }else{ span_text2.innerHTML=' byte '; } var div_title = document.createElement('div'); div_title.style.fontSize='10px'; div_title.appendChild(span_text1); div_title.appendChild(txt_limit); div_title.appendChild(span_text2); if(ta.tagName.toString().toLowerCase()=='textarea'){ //textarea일 경우만 if(!ta.rows){ta.rows="3";} var btn_0 = document.createElement('input'); btn_0.type='button'; btn_0.value='■'; btn_0.style.fontSize="10px"; btn_0.style.width="18px"; btn_0.style.height="18px"; btn_0.style.borderWidth="1px"; btn_0.onclick=function(){ this.blur(); ta.rows='3'; } var btn_p = btn_0.cloneNode(true); btn_p.value='▼'; btn_p.onclick=function(){ this.blur(); ta.rows=parseInt(ta.rows)+2; } div_title.appendChild(btn_0); div_title.appendChild(btn_p); } ta.parentNode.insertBefore(layout,ta); td1.appendChild(div_title); td2.appendChild(ta); ta.onkeyup=function(){ txt_limit.value= cm_get_byte(this.value) if(limit && txt_limit.value>limit){ alert('Max Byte = '+limit); this.value = this.value.toString().substr(0,cm_get_byte_length(this.value,limit)); txt_limit.value= cm_get_byte(this.value) } } //처음 처리 txt_limit.value= cm_get_byte(ta.value) if(limit && txt_limit.value>limit){ ta.value = ta.value.toString().substr(0,cm_get_byte_length(ta.value,limit)); } txt_limit.value= cm_get_byte(ta.value) } </script>
"공대여자는 이쁘다."를 나타내야 쓸 수 있습니다.
<script type="text/javascript">
input_textarea_limit_byte(document.getElementById('test_textarea1'),1000);
</script>
<script type="text/javascript">
input_textarea_limit_byte(document.getElementById('test_textarea2'),50);
</script>
"공대여자는 이쁘다."를 나타내야 쓸 수 있습니다.
<script type="text/javascript">
input_textarea_limit_byte(document.getElementById('test_textarea3'));
</script>
댓글
/
/
답변
수정
삭제
No Nickname
No Comment
새로운 댓글 작성
권한이 없습니다.
{{m_row.m_nick}}
내용이 너무 많습니다!
-
no-star
★☆☆☆☆
★★☆☆☆
★★★☆☆
★★★★☆
★★★★★
확인
게시물 : 1692 (113 page)
📅 달력형
📷 갤러리형
RSS
tag
제목
내용
제목+내용
제목+내용+코멘트
작성자
태그
검색
No
제목
작성자
날짜
조회
공지
[기본형] HTML (with 부트스트랩5.3 , jquery 3.7, vue.js)
#기본형
공대여자
24-02-06
02-06
31989
공지
유용한 리눅스(LINUX) 명령어
#linux
#command
공대여자
11-03-03
03-03
41936
공지
[공지] 기술 게시판
#etc
#공지
mins01
05-06-24
06-24
42786
1692
웹 페이지에서 선택된 문자열의 너비 알아오기
new
#text
#range
#width
공대여자
25-06-28
06-28
21
1691
HTML에서 자식요소를 격리 시키기 contain: strict;
new
2
#contain
#isolate
공대여자
25-06-27
06-27
42
1690
contenteditable="plaintext-only"
#contenteditable
공대여자
25-06-23
06-23
37
1689
openweathermap.org 날씨정보 API
2
#api
#날씨
공대여자
25-06-19
06-19
75
1688
css grid repeat 사용법. (동적 컬럼)
#grid
#auto-fit
#auto-fill
공대여자
25-06-01
06-01
128
1687
pointerrawupdate event
1
#pointer
공대여자
25-04-18
04-18
166
1686
scroll-snap 사용시 주의 사항
#scroll-snap
공대여자
25-04-08
04-08
160
1685
현재 폴더 기준 이미지 파일의 너비 높이 알아오기
#php
#image
공대여자
25-04-07
04-07
185
1684
motion. A modern animation library for JavaScript, React and Vue
1
#animation
#motion
공대여자
25-03-25
03-25
212
1683
canvas에서 문자열 측정값. baseline 기준 하단 상단 높이 측정. fontBoundingBoxAscent, fontBoundingBoxDescent
1
#canvas
#measuretext
공대여자
25-03-24
03-24
217
1682
개발용 테스트 웹 서버 띄우는 방법
#web
#server
공대여자
25-02-22
02-22
341
1681
vite + react
#vite
#react
공대여자
25-02-13
02-13
242
1680
wampserver
1
#amp
공대여자
25-02-12
02-12
189
1679
HTML 에서 중앙에 위치하게 할 때 center
#html
#center
#grid
공대여자
25-02-11
02-11
268
1678
git submodule 사용법 (서브모듈 속 서브모듈도)
#git
#submodule
공대여자
25-01-24
01-24
274