브라우저마다 로케이션마다 문자를 표현하는 방식이 틀리고 다국어에 따라서 한글자당 width가 틀립니다.
띄어 쓰기 없는 긴 문장같은 경우는 현재 IE에서는 css로 지원되지만 FF, Opera등의 브라우저에서는 div를 뚫고 나옵니다.
다른 좋은 방법이 있을 수 있을 수 있으나..  간단한 해결책으로는 띄어쓰기를 강제적으로 넣어주면 word-break가 적용된다는 것인데요.

현재 유니코드 1~ 126 까지의 문자는 1byte문자로 127까진가??? 아무튼 한글, 일본어, 중국어 들은 대부분 2바이트 문자열 이여서 이부분까지 처리가 된건 아니구요..

자수로 강제 띄어쓰기를 입력하게 해 놨습니다.

사용법은 javascript 의 String 오브젝트에 extend해 놨기 때문에

그 밑에서는 언제든지 wordBreak 메서드를 사용할 수 있습니다.

아래 Object.extend를 사용하지 않은다면야..
String.prototype.wordBreak = {} 이 안에 아래 wordBreak 의 function scope의 내용을 넣어주시면 됩니다.

/**
 * @author rhio.kim
 * @usage 'wordBreakTest'.wordBreak(10); //-> wordBreakT est
 * @usage '가나다라마바사'.wordBreak(3);  //-> 가나다 라마바 사
 */
Object.extend(String.prototype, {
 wordBreak : function(n) {
  var length = this.length, tmp = '';
  if(length <= n || Prototype.Browser.IE) return this;

//  if(str.charCodeAt(i)< 127) {}  //<-- 요거 처리 준비중 ㅎㅎ

  for(var i=0, sPoint=parseInt(length/n, 10); i<sPoint; i++) {
   var j = i*n;
   tmp += ' '+ this.slice(j, j+(n-1));  
  }
  return tmp;
 }
});

신고
Posted by Rhio.kim