웹마스터 팁

안녕하세요.
이번에는 글상장에 글을 적으면 몇자적은지 모르잖아요.
그래서 따로 글상자를 만들어 거기에 몇글자 적은지 실시간으로 보여
주는 겁니다. 그러니까 문자메시지 보낼때 표시되는 글자수죠.

샘플보기
http://diyworld.biz/test3.html

**head 부분에 넣으세요.(자바스크립트)**

<script language="javascript">
function cal_byte(aquery)
{
        var tmpStr;
        var temp=0;
        var onechar;
        var tcount;
        tcount = 0;
        tmpStr = new String(aquery);
        temp = tmpStr.length;
        for (k=0;k<temp;k++)
        {
                onechar = tmpStr.charAt(k);
                if (escape(onechar).length > 4) {
                        tcount += 2;
                }
                else {
                        tcount++;
                }
        }
        document.form1.cbyte.value = tcount;
        if(tcount>255) {
                reserve = tcount-255;
                alert("설명은 30 이상은 전송하실수 없습니다.rn 쓰신 글은 "+reserve+"30자가 초과되었습니다.rn 초과된 부분은 자동으로 삭제됩니다.");
                cutText();
                return;
        }        
}

function cutText()
{
        nets_check(document.form1.comment.value);
}

function nets_check(aquery)
{
        var tmpStr;
        var temp=0;
        var onechar;
        var tcount;
        tcount = 0;
        tmpStr = new String(aquery);
        temp = tmpStr.length;
        for(k=0;k<temp;k++)
        {
                onechar = tmpStr.charAt(k);
                if(escape(onechar).length > 4) {
                        tcount += 2;
                }
                else {
                        tcount++;
                }
                if(tcount>255) {
                        tmpStr = tmpStr.substring(0,k);
                        break;
                }
        }
        document.form1.comment.value = tmpStr;
        cal_byte(tmpStr);
}

function cal_pre()
{
        var tmpStr;
        document.form1.item_num.value == -1 ;
        tmpStr = document.form1.comment.value;
        cal_byte(tmpStr);
}
</script>

**body 부분에 넣으세요.**

<form name="form1">
    <p>스킨에 적용해도 상당히 괜찮을뜻 합니다.</p>
    <p> </p>
    <p><input type="text" name="comment" onKeyUp='javascript:cal_pre();' style="border:1 solid #669090" size="51" maxlength="30" value="" tabindex="2"></p>
    <p><input size=5 value=0 name=cbyte style="border:1 solid #669090">
              /<font color="#0000FF"> 코멘트는 60byte 이하로 작성하여 주시기 바랍니다</font>
              <input type=hidden name=item_num value="-1" style="WIDTH: 0px; HEIGHT: 0px" size=5></p>
            
               </form>

**설명**

글상자 폼네임을 form1 으로 하였고 자바스크립트에도 form1 네임 맟춤
저는 글적을 상자 이름을 comment라 하고 자바스크립트에도 comment 맞춤
숫자가 표시될 글상자 이름을 cbyte라 함고 자바스크립트도 맞춤
input 타입에서 글적는 상자에는 onKeyUp='javascript:cal_pre(); 이부분을 삽입함.
그리고 글자수 표시될 상자에는 input type=hidden name=item_num value="-1" 이부분을 꼭 삽입할것.

이상입니다.
그냥 샘플보시고 소스보시면 수정하실수 있을것 같네요.

총으면 추천한방..펑..
제목 글쓴이 날짜
Content (and확장) 위젯에서 추출대상 첨부이미지일 경우 카테고리명 및 이미지+제목 형식 섬네일 표시 못하는 문제 으흥 2013.02.17
아이콘샵 모듈 이용해서 대표 아이콘 사용시 레벨 아이콘 나오지 않게 하기 [4] 하은이아빠 2012.10.01
팝업창 자동 사이즈 조절 js Alex 2013.02.17
방명록 모듈 1.5.1.1에서 비회원이 남긴글 삭제하기 조슈아킴 2013.02.14
호스팅비 돈아낍시다. 하나의 XE 다중 도메인 사용하기. [10] kimnada 2010.12.02
코멘트를 달아야만 첨부파일 다운로드 할 수 있게 하기 [8] file 지오426 2008.07.29
SMTP 인증 회원가입 메일 인증 , 비밀번호 오류찾기 및 답변글 메일로 받기 [11] file FFHosting 2009.01.12
이미디오 (이미지->동영상) 기능을 적용해보자. [8] file asterisk 2013.02.12
[Css]필터 관련 스타일시트 속성 [1] 웹엔진 2011.04.13
흥미로운 AND, OR 조건문 엘카 2013.02.10
PHP_5_IF 문과 기본 연산자 [1] 아무흐 2008.03.26
개인 웹서버 백업 및 게시물 등록 날짜 수정 방법 [10] file eunbini 2008.10.24
회원 정보에 내 포인트 현황 출력하기 [3] file 화랑529 2013.01.08
xpresseditor 사용시 첨부파일 본문삽입 중복되는 문제 수정. [13] file misol 2012.01.31
XE 1.5.1 로 사이트 꾸미기 Part 3. [22] file 황비 2011.12.06
ShopXE 상품 첨부 - 상품이미지 등록시 첨부 용량 초과 에러 수정 hhgyu 2013.02.05
로그인 스킨 수정 팁 - 신규 쪽지 수 보여주기 [17] file 러브스킬 2010.05.03
모바일 페이지모듈에서 스킨 설정안 되는 버그 수정법 [2] sejin7940 2013.01.08
Database, MySQL 이 무엇인가~~~ ^^ [103] zero 2000.03.06
[PHP 기초] PHP 소개 [6] 난다날아 2011.03.22