SOFTELメモ Developer's blog

会社概要 ブログ 調査依頼 採用情報 ...
技術者募集中

【Javascript】テキストエリアに入力した文字数を数える

問題

Javascriptで、テキストエリアに入力した文字列の文字数を数えてください。

答え

demo

テキストエリアの文字列の文字数は 文字です。


source

<textarea onkeyup="document.getElementById('xxxx').value=this.value.length"></textarea>

テキストエリアの文字列の文字数は <input type="text" id="xxxx"> 文字です。

単純に “文字列”.length で取得できる。

全角文字も半角文字も改行もスペースも1文字としてカウントされる。

サンプルではonkeyupで再計算している。

関連記事

【Javascript】テキストエリアに入力した文字列のバイト数を数える

関連するメモ

コメント(4)

junko 2012年9月29日 00:20

IEで試してますが、Ctrl+Zが動作しなくなりますね。

yoshimura 2012年9月29日 10:38

textareaには問題がなくて、文字数を表示しているinputの値を書き換えているのが影響するみたいです。
フォームの扱いがブラウザによって違うような気がします。
 Firefox → 個々の入力欄でRedo(Ctrl+Y)、Undo(Ctrl+Z)できる
 IE → フォーム全体でRedo(Ctrl+Y)、Undo(Ctrl+Z)する
文字数をinputではなくて、spanなどの中に表示するようにすると、フォームには影響しなくなるようです。

参考: https://www.softel.co.jp/blogs/tech/archives/3549

Ju 2012年10月18日 21:42

WindowsVista+IE7で、以下のコードでも動作しないです。spanもアウトっぽい。
———————————————————————————–

文字数=
———————————————————————————–

匿名 2016年12月20日 15:59

それだとが2文字に数えられてしまいます。