<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script src="http://www.google.com/jsapi"></script><script>google.load("jquery", "1");</script>
<script>
$(function() {
setByteCounter($("#t"), $("#c"), 240);
});
function setByteCounter(jTextbox, jCounterSpan, nMax) {
jTextbox.keyup(function() {
var nCnt = countLength($(this).val());
var counterText = "({0} / {1})"
.replace("{0}", nCnt)
.replace("{1}", nMax)
jCounterSpan.text(counterText);
jCounterSpan.css("color", (nCnt > nMax ? "red" : "gray"));
});
jTextbox.keyup();
}
function countLength(str) {
str = str.replace("\r\n", "\n").replace("\r", "\n"); // CRLF, CRを、LFの改行コードに変換
var r = 0;
for (var i = 0; i < str.length; i++) {
var c = str.charCodeAt(i);
// Shift_JIS: 0x0 〜 0x80, 0xa0 , 0xa1 〜 0xdf , 0xfd 〜 0xff
// Unicode : 0x0 〜 0x80, 0xf8f0, 0xff61 〜 0xff9f, 0xf8f1 〜 0xf8f3
if ( c == "\n".charCodeAt(0) ) { // 改行コードLF
r += 2;
} else if ( (c >= 0x0 && c < 0x81) || (c == 0xf8f0) || (c >= 0xff61 && c < 0xffa0) || (c >= 0xf8f1 && c < 0xf8f4)) {
r += 1;
} else {
r += 2;
}
}
return r;
}
</script>
</head>
<body>
<div>
バイト数をリアルタイムに表示して、入るかどうかを確かめる。<br>
</div>
<textarea type="text" id="t"></textarea> <span id="c"></span>
</body>