티스토리 뷰

웹개발이야기/Html,Javascript

입력할때마다 Byte 계산하기

최고다님 2014. 8. 12. 16:32

갑자기 잉여력 폭발..

뭐 어렵지도 않은거니 끄적거려 봤음..

물론 HTML 파일 만들고 그러는거 너무 귀찮아서 Fiddle로 만든것은 함정-_-

http://jsfiddle.net/a9qgoh7t/2/



혹시나 백업을 위해서 아래에 코드 게시


<!DOCTYPE html>

<html>


<head>

    <meta http-equiv="content-type" content="text/html; charset=UTF-8">

    <title>demo</title>

    <script type='text/javascript' src='http://code.jquery.com/jquery-git2.js'></script>

    <script type='text/javascript'>

        $(function() {

            $('#board').bind('keyup', function(event) {

                //version 2

                var curVal = $(this).val();

                stringByteLength = (function(s, b, i, c) {

                    for (b = i = 0; c = s.charCodeAt(i++); b += c >> 11 ? 3 : c >> 7 ? 2 : 1);

                    return b

                })(curVal);

                $('#byteViewer').val(stringByteLength + " Bytes");

                return true;


                //version 1

                var curVal = $(this).val();

                var pattern = /[\u3131-\u314e|\u314f-\u3163|\uac00-\ud7a3]/g;


                var koreanLangCnt = !!curVal.match(pattern) ? curVal.match(pattern).length : 0;

                var etcLangCnt = curVal.length - koreanLangCnt;

                var koreanLangByte = koreanLangCnt * 2;

                var etcLangByte = etcLangCnt;


                $('#byteViewer').val(koreanLangByte + etcLangByte);

            });

        });

    </script>

</head>


<body>

<div style="width: 500px; border: 1px solid gray; padding: 10px; margin: 5px auto; overflow: hidden;">

    <textarea id="board" style="width: 99%;" rows="5"></textarea>

    <input type="text" id="byteViewer" style="float: right; width: 100px; text-align: right; border: 0;" readonly="readonly" />

</div>

</body>


</html>

'웹개발이야기 > Html,Javascript' 카테고리의 다른 글

HTML5 클립보드 이미지 붙혀넣기  (0) 2016.11.29
Object 예쁘게 화면에 뿌리기  (0) 2016.11.14
새로 알게된 Boolean형 !!  (0) 2011.03.21
script의 위치는 어디에 두어야 할까?  (0) 2011.03.21
Date 연산하기  (0) 2011.03.21
공지사항
최근에 올라온 글
최근에 달린 댓글
Total
Today
Yesterday
링크
TAG more
«   2024/05   »
일 월 화 수 목 금 토
1 2 3 4
5 6 7 8 9 10 11
12 13 14 15 16 17 18
19 20 21 22 23 24 25
26 27 28 29 30 31
글 보관함