픽셀단위 문자열 자르기 (한글자르기)
인터넷정보2007. 10. 11. 23:33
JavaScript용 픽셀단위 문자열 자르기
// by ziecle 07.02.06
function __getText(elem)
{
if (elem.innerText) return elem.innerText;
if (elem.textContent) return elem.textContent;
return elem.innerHTML.replace(/<\/?[^>]+>/gi,"");
}
function __setText(elem, text)
{
if (elem.innerText) { elem.innerText = text; return; }
if (elem.textContent) { elem.textContent = text; return; }
while (elem.firstChild) elem.removeChild(elem.firstChild);
elem.appendChild(document.createTextNode(text), elem.childNodes[0]);
}
function stringCut(elem, cutWidth, suffix)
{
var str = __getText(elem);
var len;
if (!str || !(len = str.length))
return;
elem.style.whiteSpace = "nowrap";
elem.style.textOverflow = "ellipsis";
elem.style.overflow = "hidden";
var width = elem.offsetWidth;
if (!width || width < cutWidth - 8)
return;
var temp = cutWidth;
if (suffix)
{
elem.innerHTML += suffix;
cutWidth -= (elem.offsetWidth - width + 4);
if (cutWidth < 0)
return;
}
else
{
suffix = "";
}
elem.title = str;
var cut = parseInt(cutWidth / (width / len)) + 1;
__setText(elem, str.substr(0, cut));
if (elem.offsetWidth > cutWidth)
{
while (--cut)
{
__setText(elem, str.substr(0, cut).replace(/(\s*$)/g, ""));
if (elem.offsetWidth < cutWidth)
{
break;
}
}
}
else
{
while (cut++ < len)
{
__setText(elem, str.substr(0, cut));
if (elem.offsetWidth > cutWidth)
{
__setText(elem, str.substr(0, cut - 1).replace(/(\s*$)/g, ""));
break;
}
}
}
elem.innerHTML += suffix;
}
방법은 무식합니다.
IE 6, 파폭 2.0.0.1에서 테스트했습니다.
사용법:
stringCut(문자열이 들어가는 엘리먼트, 너비, 붙을단어);
예제:
랄랄랄라~라랄라~랄랄랄라~라랄라~랄랄랄라~라랄라~랄랄랄라~라랄라~
'인터넷정보' 카테고리의 다른 글
설문조사 등등 로딩바 구현 (0) | 2007.10.11 |
---|---|
AJAX를 이용한 메모보드(포스트잇) (0) | 2007.10.11 |
PHP로 작동하는 RSS 읽는 함수 (0) | 2007.10.11 |
심플한 라이트박스 효과 (이미지, 아이프레임, html 지원) (0) | 2007.10.11 |
HTTP 인증(Basic타입)이 걸린 URL을 fsockopen에서 여는 방법 (0) | 2007.10.11 |
설치가 필요없는 ftp, telnet 프로그램 (0) | 2007.10.11 |
파폭에서 익스플로러를 쓰자 (0) | 2007.10.11 |
상하 좌우 롤링 소스 (0) | 2007.10.11 |
로깅(Logging) 하기 (0) | 2007.10.11 |
인기도 점수 뽑아오는 클래스(추천 비추천 코멘트 히트수) (0) | 2007.10.11 |
문자열 바이트 길이알기, 바이트만큼 자르기
인터넷정보2007. 10. 11. 14:28
<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>
--------------------=------------------
사용법,
textbox나 textarea 만들고
함수 실행
<script type="text/javascript">
input_textarea_limit_byte(document.getElementById('test_textarea1'),1000);
</script>
input_textarea_limit_byte(대상[,최대 Byte]);
input_textarea_limit_byte(대상); <- 바이트 체크를 하지 않고 바이트 수만 보여줍니다.
--------------------=--------------
//================================================================
// 문자열 바이트 알아내기
//================================================================
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>
--------------------=------------------
사용법,
textbox나 textarea 만들고
함수 실행
<script type="text/javascript">
input_textarea_limit_byte(document.getElementById('test_textarea1'),1000);
</script>
input_textarea_limit_byte(대상[,최대 Byte]);
input_textarea_limit_byte(대상); <- 바이트 체크를 하지 않고 바이트 수만 보여줍니다.
--------------------=--------------
'인터넷정보' 카테고리의 다른 글
showModelessDialog 를 FF에서 사용하기 (0) | 2007.10.11 |
---|---|
문자열 <-> 유니코드 변환 escape(),unescape() (0) | 2007.10.11 |
현재 스크롤 위치 알아내기 (0) | 2007.10.11 |
롤링 배너용 js(class 형식) (0) | 2007.10.11 |
try{...} catch(e){...} 구문 , e.number,e.description (0) | 2007.10.11 |
API를 모와둔 사이트 gotapi.com (0) | 2007.10.11 |
PNG24 반투명 지원법 (IE용) (0) | 2007.10.11 |
JS 트리구조 메뉴 (0) | 2007.10.11 |
select 용 함수 모음 (0) | 2007.10.11 |
UTF-8로 바꾸는 법, 문자열 인코딩 바꾸기 (0) | 2007.10.11 |