티스토리 뷰

DEVELOPE/JAVASCRIPT

텍스트박스에 입력되는 문자의 바이트 수를 제한하는 스크립트

소찾나 2017. 8. 25. 11:30
336x280(권장), 300x250(권장), 250x250, 200x200 크기의 광고 코드만 넣을 수 있습니다.

텍스트박스에 입력되는 문자의 바이트 수 제한하는 스크립트


<HTML>
<HEAD>
<TITLE>입력바이트수 제한</TITLE>
<script language="javascript">
//-- textarea에 입력바이트 수를 계산 


var clearChk=true;
var limitByte = 80; //바이트의 최대크기, limitByte 를 초과할 수 없슴

// textarea에 마우스가 클릭되었을때 초기 메시지를 클리어
function clearMessage(frm){

  if(clearChk){ 
    frm.messagebox.value="";
    clearChk=false;
  }

}

// textarea에 입력된 문자의 바이트 수를 체크
function checkByte(frm) {
   
        var totalByte = 0;
        var message = frm.messagebox.value;

        for(var i =0; i < message.length; i++) {
                var currentByte = message.charCodeAt(i);
                if(currentByte > 128) totalByte += 2;
	else totalByte++;
        }
        frm.messagebyte.value = totalByte;

        if(totalByte > limitByte) {
                alert( limitByte+"바이트까지 전송가능합니다.");
	frm.messagebox.value = message.substring(0,limitByte);
        }
}
</script>
</HEAD>

<BODY>
<form name="form">
<table width="141" height="147" border="0" cellpadding="0" cellspacing="0" height="200">
  <tr>
    <td>
      <table width="140" cellspacing="0" cellpadding="0" >
      <tr>
      <td height="20"></td>
     </tr>
    <tr>
<td align="center"><textarea name="messagebox" cols="17" rows="5" onFocus="clearMessage(this.form);" onKeyUp="checkByte(this.form);">내용을 입력하세요</textarea></td>
    </tr>
    </table>
      <table width="140" border="0" cellspacing="0" cellpadding="0">
    <tr>
       <td><img src="../img_common/blank.gif" width="1" height="5"></td>
    </tr>
    </table>
    <table width="140" height="27" border="0" cellpadding="0" cellspacing="0">
    <tr>
    <td align="left"><input type="text" name="messagebyte" value="0" size="1" maxlength="2" readonly>
    <font color="#000000">/ 80 byte</font></td>
    </tr>
    </table>
    </td> 
    </tr>
</table>
</form>
</BODY>
</HTML>





============================================================================

 ▧ 텍스트박스 안에 디폴트 텍스트 넣고 클릭시 디폴트 텍스트 없어지고, 글자수 제한하는 스크립트 ▧



<script type="text/javascript">
var clearChk=true;

		function clearMessage(frm)
		{
		var fn = document.pollForm;
		if(clearChk){ 
			fn.research.value="";
			clearChk=false;
		}
		}


	   function textlength()
	   {
		 var fn = document.pollForm;
		 if(fn.research.value.length > 1000)
		 {
			alert('죄송합니다. 500자까지 입력이 가능합니다.');
			fn.research.value = fn.research.value.substring(0,1000);  
	        fn.research.focus();  
		 }
	   }
</script>




<form name="pollForm" method="post" action="./research_12.html">
<textarea name="research" cols="81" rows="5" class="box01" id="textarea" onFocus="clearMessage(this.form)"  onKeyup="textlength()">500자 내외</textarea>
</form>




========================================================================================






function CheckStrLen(maxlen,field)
{
    var temp; //들어오는 문자값...
    var msglen;
    msglen = maxlen*2;
    var value= field.value;
   
    l =  field.value.length; 
    tmpstr = "" ;
    
    if (l == 0)
	{
        value = maxlen*2;
    }
	else
	{
		for(k=0;k<l;k++)
		{
			temp =value.charAt(k);
     
			if(escape(temp).length > 4)
			{
				msglen -= 2;
			}
			else
			{
				msglen--;
			}
     
			if(msglen < 0)
			{
				alert("총 영문 "+(maxlen*2)+"자 한글 " + maxlen + "자 까지 보내실수 있습니다.");
				field.value= tmpstr;
				break;
			}
			else
			{
				tmpstr += temp;
			}
		}
	}
}


저작자표시 비영리 변경금지

'DEVELOPE > JAVASCRIPT' 카테고리의 다른 글

자바스크립트 [javascript]  (0) 2017.10.30
체크박스 하나만 선택하기  (0) 2017.10.13
[자바스크립트] 이벤트 핸들러 모음  (0) 2017.01.31
[자바스크립트] 문자열함수  (0) 2017.01.31
공유하기 링크
댓글