JavaScriptを使って、テキストエリアに入力された文字数をカウントする方法を紹介します。

まずはデモをどうぞ。
実際に試してみてください。

入力されてテキストが何文字か判定します。：
サンプル・デモ

使用したコードは以下。

<script>
function strCount(){
var CODE_TYPE_ASCII = 0;
var CODE_TYPE_KANA = 2;
var CODE_TYPE_KANJI = 4;

var zenLen = "あ".length;		// 全角の文字数(全角を1文字と数えるブラウザと2文字と数えるブラウザがある)
var crlfCount = 0;				// 改行の文字数（CRとLFは別々にカウントする）
var spaceCount = 0;				// 半角空白（スペースとタブ）の文字数
var space2WidthCount = 0;		// 全角空白（スペース）の文字数
var lines = 0;					// 行数
var utf16Bytes = 0;				// 改行を除くUTF-16バイト数
var utf8Bytes = 0;				// 改行を除くUTF-8バイト数
var shiftjisBytes = 0;			// 改行を除くShift-JISバイト数
var eucjpBytes = 0;				// 改行を除くEUC-JPバイト数
var jisBytes = 0;				// 改行を除くJISバイト数
var codeLF = "n".charCodeAt(0);
var codeCR = "r".charCodeAt(0);
var codeTab = "t".charCodeAt(0);
var codeSpace = " ".charCodeAt(0);
var codeSpace2Width = "　".charCodeAt(0);
var codeType = CODE_TYPE_ASCII;

var frm = document.forms[0];
var str = frm.str.value;
str = str.replace("rn", "n");
for (var i = 0; i < str.length; i++) {
	var code = str.charCodeAt(i);
	if (code < 0) {
		alert("このブラウザではカウントできません。");
		return;
	}
	if (code = 0xFF61 && code = 0x10000) {
		// 全角（UCS-4マルチバイト文字）
		if (codeType != CODE_TYPE_KANJI) {
			jisBytes += 3;
			codeType = CODE_TYPE_KANJI;
		}
		utf8Bytes += 4;
		utf16Bytes += 3;
		shiftjisBytes += 2;		// Shift_JISやEUC-JP、JISには文字割り当てがない
		eucjpBytes += 2;
		jisBytes += 2;
	} else {
		// 全角
		if (codeType != CODE_TYPE_KANJI) {
			jisBytes += 3;
			codeType = CODE_TYPE_KANJI;
		}
		utf8Bytes += 2;
		utf16Bytes += 2;
		shiftjisBytes += 2;
		eucjpBytes += 2;
		jisBytes += 2;
		if (code == codeSpace2Width) {
			space2WidthCount++;
		}
	}
}
if (str.length != 0 && str.charAt(str.length - 1) != "n") {
// 最後の文字が改行で終わっていない場合、行を増やす
lines++;
}
if (codeType != CODE_TYPE_ASCII) {
// 最後の文字がASCII文字でない場合、エスケープシーケンスを増やす
jisBytes += 3;
}

frm.count.value = str.length;
frm.withoutcrcount.value = str.length - crlfCount;
frm.withoutcrspacecount.value = str.length - crlfCount - spaceCount - space2WidthCount;
frm.utf8bytes.value = utf8Bytes + crlfCount * 2;
frm.utf16bytes.value = utf16Bytes + crlfCount * 2;
frm.shiftjisbytes.value = shiftjisBytes + crlfCount * 2;
frm.eucjpbytes.value = eucjpBytes + crlfCount * 2;
frm.jisbytes.value = jisBytes + crlfCount * 2;
frm.lines.value = lines;
frm.str.focus();
}
</script>

htmlの冒頭<head>〜</head>内で上記スクリプトを呼び出し、<body>〜</body>内には以下のように記述します。

<form method="post" action="#" onsubmit="strCount(); return false;" onreset="document.forms[0].str.focus()">

<p>
<textarea name="str" rows="10" cols="60" wrap="soft" accesskey="s"></textarea><br/>
<input type="submit" value="カウント"/>
<input type="reset" value="リセット"/>
</p>

<table>
<tbody>
<tr>
<th>文字数</th>
<td><input type="text" name="count" value="" size="10"/>文字</td>
</tr>
<tr>
<th>改行を除いた文字数</th>
<td><input type="text" name="withoutcrcount" value="" size="10"/>文字</td>
</tr>
<tr>
<th>改行、空白を除いた文字数</th>
<td><input type="text" name="withoutcrspacecount" value="" size="10"/>文字</td>
</tr>
<tr class="display-none">
<th>バイト数（UTF-8）</th>
<td><input type="text" name="utf8bytes" value="" size="10"/>バイト</td>
</tr>
<tr class="display-none">
<th>バイト数（UTF-16）</th>
<td><input type="text" name="utf16bytes" value="" size="10"/>バイト</td>
</tr>
<tr class="display-none">
<th>バイト数（Shift-JIS）</th>
<td><input type="text" name="shiftjisbytes" value="" size="10"/>バイト</td>
</tr>
<tr class="display-none">
<th>バイト数（EUC-JP）</th>
<td><input type="text" name="eucjpbytes" value="" size="10"/>バイト</td>
</tr>
<tr class="display-none">
<th>バイト数（JIS）</th>
<td><input type="text" name="jisbytes" value="" size="10"/>バイト</td>
</tr>
<tr>
<th>行数</th>
<td><input type="text" name="lines" value="" size="10"/>行</td>
</tr>
</tbody>
</table>

</form>

実際に動くサンプルは以下のリンクからどうぞ。

入力されてテキストが何文字か判定します。：
サンプル・デモ