Web：textareaのmaxlength - ぷちWiki

概要

textarea で文字数制限をしたいことはよくあるのですが、現状では一筋縄ではいかないようです。
HTML5 では textarea の属性として maxlength が追加され、これを設定すれば事足りるのですが、HTML5 に対応していないブラウザ（IE8 以下）では、JavaScript を駆使して対応しないといけなくなります。

ホント、IE は早く消えて無くなってもらえないだろうか。。。。

jquery を使う方法

スクラッチで JavaScript で対応する方法ももちろんあるのですが、jquery を使う方が簡単なので、基本的にはこれがおすすめです。
ただ、日本語が絡むと挙動が微妙なので、基本的には HTML5 対応のブラウザを使うことをおすすめするべきですね。

下記の jquery のプラグインを使うと簡単に実現できます。

[maxlength plugin | http://remysharp.com/2008/06/30/maxlength-plugin/]

js ファイルを取得したら適当な場所に設置します。

 <script type="text/javascript" src="js/jquery.maxlength.js"></script>

例えば、40 文字の文字数制限を行いたい場合には、以下のように textarea のタグ内で属性を指定します。

 <textarea maxlength="40"></textarea>

さらに、この記述の後に以下のように記述して有効化します。
$('textarea') 指定だと、全ての textarea が対象となります。

 <script type="text/javascript">
 $('textarea').maxlength();
 </script>