My Name is Kay....

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

추가 포스팅이 이뤄지지 않는 블로그입니다. 문의는 wkzkfmxksi@gmail.com 으로 연락주세요.
kay
조회 수 9703 추천 수 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 etc $.trim(str) trim... kay 2013.10.16 3957
53 UI .on kay 2013.04.03 4919
52 etc 1.9x 버전 $.browser 삭제 대체 사용 2 kay 2013.04.26 5661
51 UI animate - 각종 애니메이션 효과 kay 2013.04.11 26330
50 UI AutoCompleate - ( JSON + Jquery ) kay 2013.04.02 5905
49 UI AutoCompleate - ( XML + Jquery ) kay 2013.03.08 5540
48 A to Z CheckBox 값 읽어오기 kay 2013.05.06 25268
47 A to Z datepicker 달력 file kay 2013.08.05 6315
46 etc FadeIn , FadeOut 을 이용한 간단한 메인 배너 이미지 노출. kay 2014.10.23 2999
45 PlugIn fancyBox - 레이어팝업 (추천) kay 2013.04.16 32412
44 etc input hidden <-> text 변경하기 kay 2013.05.03 5957
43 A to Z Javascript 강제 이벤트 실행시키기 "trigger" kay 2013.07.30 6042
42 A to Z JQuery A to Z kay 2013.01.02 5114
41 PlugIn jQuery Formatnumber , 콤마처리 kay 2015.11.03 2095
40 A to Z jQuery Learning Center - 공부 공부 kay 2013.04.05 4236
39 etc Jquery Load 유무 체크하기 kay 2014.02.12 4287
38 PlugIn jQuery Org Chart - 조직도 그리기 file kay 2014.09.01 16612
37 PlugIn jQuery Plugin For Auto Resizing iFrame - iFrame Resizer file kay 2014.03.10 105580
36 UI Jquery Slider Bar / 슬라이더 바 3종 샘플 file kay 2014.07.28 6713
35 PlugIn jQuery Zoom - 이미지 줌 제어 ( 휠 , 클릭 , 오버 ) kay 2013.04.17 8426
Board Pagination Prev 1 2 3 Next
/ 3