My Name is Kay....

DIY , 먹방 , 개발 , 육아 , 여행 좋아합니다.
AdBlock 사용시 화면이 정상적으로 노출되지 않습니다.
포스팅 관련 문의 및 개발 문의는 Email : wkzkfmxksi@gmail.com

추가 포스팅이 이뤄지지 않는 블로그입니다. 문의는 wkzkfmxksi@gmail.com 으로 연락주세요.
kay
조회 수 9702 추천 수 0 댓글 1
?

단축키

Prev이전 문서

Next다음 문서

크게 작게 위로 아래로 댓글로 가기 인쇄
?

단축키

Prev이전 문서

Next다음 문서

크게 작게 위로 아래로 댓글로 가기 인쇄

SMS 발송 폼 처리 중 80 바이트 체크하기 위해서..

사용 편의를 위해 일부 내용이 수정되었습니다.


원개발자분께 감사드립니다. ( http://blog.naver.com/yesdouble/130152964039 )


Test Url : http://www.uhoon.co.kr/test/2410.html


<!DOCTYPE html>
<html>
<head>
	<title>한글/영어 byte 체크해서 자르기</title>
	<script src="http://code.jquery.com/jquery-latest.min.js"></script>
	<meta http-equiv="content-type" content="text/html;charset=UTF-8">
</head>
<body >
<script type="text/javascript">
	$(function () {
		$('.remaining').each(function () {
			// count 정보 및 count 정보와 관련된 textarea/input 요소를 찾아내서 변수에 저장한다.
			var $maxcount = $('.maxcount', this);
			var $count = $('.count', this);
			var $input = $("#contents");

			// .text()가 문자열을 반환하기에 이 문자를 숫자로 만들기 위해 1을 곱한다.
			var maximumByte = $maxcount.text() * 1;
			// update 함수는 keyup, paste, input 이벤트에서 호출한다.
			var update = function () {
				var before = $count.text() * 1;
				var str_len = $input.val().length;
				var cbyte = 0;
				var li_len = 0;
				for (i = 0; i < str_len; i++) {
					var ls_one_char = $input.val().charAt(i);
					if (escape(ls_one_char).length > 4) {
						cbyte += 2; //한글이면 2를 더한다
					} else {
						cbyte++; //한글아니면 1을 다한다
					}
					if (cbyte <= maximumByte) {
						li_len = i + 1;
					}
				}
				// 사용자가 입력한 값이 제한 값을 초과하는지를 검사한다.
				if (parseInt(cbyte) > parseInt(maximumByte)) {
					alert('허용된 글자수가 초과되었습니다.\r\n\n초과된 부분은 자동으로 삭제됩니다.');
					var str = $input.val();
					var str2 = $input.val().substr(0, li_len);
					$input.val(str2);
					var cbyte = 0;
					for (i = 0; i < $input.val().length; i++) {
						var ls_one_char = $input.val().charAt(i);
						if (escape(ls_one_char).length > 4) {
							cbyte += 2; //한글이면 2를 더한다
						} else {
							cbyte++; //한글아니면 1을 다한다
						}
					}
				}
				$count.text(cbyte);
			};
			// input, keyup, paste 이벤트와 update 함수를 바인드한다
			$input.bind('input keyup keydown paste change', function () {
				setTimeout(update, 0)
			});
			update();
		});
	});
</script>
<div>
<textarea rows="5" cols="50" id="contents"/></textarea>
</div>
<span class="remaining">
	<span class="count">0</span>/<span class="maxcount">80</span>byte(한글 40자, 영어 80자)
</span>
</body>
</html>


?

List of Articles
번호 분류 제목 글쓴이 날짜 조회 수
54 UI woothemes FlexSlider - 슬라이더 file kay 2014.09.16 286160
53 PlugIn jQuery Plugin For Auto Resizing iFrame - iFrame Resizer file kay 2014.03.10 105345
52 UI SelectBox Option 값 초기화 및 수정 삭제 kay 2013.03.02 36655
51 PlugIn fancyBox - 레이어팝업 (추천) kay 2013.04.16 32407
50 etc 에러 리포팅 , Ajax 디버깅 ( JS , ASP ) - 오류메시지 확인하기 kay 2013.03.08 30612
49 UI animate - 각종 애니메이션 효과 kay 2013.04.11 26329
48 A to Z CheckBox 값 읽어오기 kay 2013.05.06 25267
47 etc Table에 동적 Tr 추가/삭제 하기 kay 2014.02.09 21271
46 PlugIn jquery-syaku.rolling 상하좌우 롤링 ( 자동롤링 , 버튼 ) 10 file kay 2014.02.09 20152
45 UI 스크롤 탑 컨트롤 - scrolltop control kay 2013.05.29 18965
44 PlugIn makisu - 메뉴 접기(?) kay 2013.04.16 18446
43 PlugIn tiptip - 툴팁 kay 2013.04.14 17886
42 PlugIn jQuery Org Chart - 조직도 그리기 file kay 2014.09.01 16605
41 PlugIn 자동 롤링 배너 Jquery 2 file kay 2013.08.07 13877
40 PlugIn Star Rating Plugin - jQuery 별점 주기 2 file kay 2014.05.01 13219
39 PlugIn Smooth Scroll - 스크롤 이동 ( 속도 , 위치 ) 2 file kay 2013.04.06 12676
38 PlugIn poshytip - 툴팁 kay 2013.04.15 11803
37 UI 동적으로 추가된 객체에 datepicker() 적용하기 kay 2013.11.06 10120
» etc 한글/영어 byte 체크해서 자르기 1 kay 2013.11.30 9702
35 UI select Box option ( 초기화,추가,삭제 ) kay 2013.04.03 9529
Board Pagination Prev 1 2 3 Next
/ 3