【JavaScript】文字数を数える

問題

JavaScriptで、半角は2文字で1、全角は1文字で1とカウントしてみてください。

答え

デモ

JavaScript

<input type="text" value="" class="char_count" data-limit="100" data-display="#char_count_display1">
<span id="char_count_display1"></span>

<textarea class="char_count" data-limit="350" data-display="#char_count_display2"></textarea>
<span id="char_count_display2"></span>

<script>
$(function() {
	$(".char_count").on("keyup", function() {
		var o = $(this);
		var str = o.val();
		var limit = o.data("limit") - 0;
		var r = 0;
		for (var i = 0; i < str.length; ++i) {
			var c = str.charCodeAt(i);
			if (c >= 0x0 && c <= 0x7f) {
				r += 1;
			} else {
				r += 2;
			}
		}
		if (r > limit) {
			$(o.data('display')).html(Math.floor((r - limit) / 2) + "文字オーバーです");
		} else {
			$(o.data('display')).html("残り約" + Math.floor((limit - r) / 2) + "文字です");
		}
	});

	$(".char_count").each(function() {
		$(this).trigger("keyup");
	});
});
</script>