javascript / 특정 글자수가 넘어가면 넘어가는 글자는 자르고 마지막에 대체문자 처리

2016.01.05 12:04language/javascript


javascript에서 특정 글자수가 넘어가면 화면의 UI가 깨지는 경우가 발생한다.

 

예를 들면 아래와 같이 메인 화면에

 

배너 게시판 영역을 만들면 생각보다 작은 영역이 생기고

 

그 영역에 표시할 수 있는 글자수는 한정적이다.

 

이미지는 대전시청 홈페이지에서 발췌했습니다.

 

 

이때 화면이 깨지지 않을 정도의 글자수를 파악한 뒤 나머지 글자는 대체문자(... , 등)로 처리한다.

 

내용 및 사용방법은 주석으로 대체한다.

    /** @param txt<br/>
     *  @param len : 생략시 기본값 20<br/>
     *  @param lastTxt : 생략시 기본값 "..."<br/>
     *  @returns 결과값
     * <br/>
     * <br/>
     * 특정 글자수가 넘어가면 넘어가는 글자는 자르고 마지막에 대체문자 처리<br/>
     *  ex) 가나다라마바사 -> textLengthOverCut('가나다라마바사', '5', '...') : 가나다라마...<br/>
     */
    function textLengthOverCut(txt, len, lastTxt) {
        if (len == "" || len == null) { // 기본값
            len = 20;
        }
        if (lastTxt == "" || lastTxt == null) { // 기본값
            lastTxt = "...";
        }
        if (txt.length > len) {
            txt = txt.substr(0, len) + lastTxt;
        }
        return txt;
    }
cs