JavaScriptを使った文字数チェッカー-全角半角共1文字と数える

　文字数チェッカーがサイトにほしい。

　JavaScriptを使った文字数チェッカーってどう記述するんだっけ？

文字数チェッカー

　まずはものすごく簡単な文字数チェッカー。

　全角半角関係なく1文字として数える。

　ボックス内に文字を入力するか、文字を貼り付けて「Enter」キーを押す。

0文字

文字入力するエリアのHTML

　基本のコードは↓

<textarea cols="24" rows="3" onkeyup="ShowLength(value);"></textarea>
<p id="inputlength">0文字</p>

　これだけだと面白くないので、周りのふちの色を指定してみた。

入力された文字を数えるためのJavaScript

<script type="text/javascript"><!--
function ShowLength( str ) {
document.getElementById("inputlength").innerHTML = str.length + "文字";
}
// --></script>

ワードプレスに記述するときの注意

　WordPressの投稿画面にコードを記載するときは、「テキスト」で記述する。

　「ビジュアル」に切り替えるとテキストボックスが消えてしまう。

　サイドバーに記載するときは「テキストウィジェット」に記載する。