ジャバスクリプトでテキストエリアに入力した文字数を表示する方法

2009/05/04 21:39

このQ&Aのポイント

ジャバスクリプトでテキストエリアに入力した文字数を表示する方法について紹介します。テキストエリアの入力を監視し、文字列の長さを取得して表示する方法です。
上記のHTMLコードでは、テキストエリアの入力イベントを監視し、入力された文字列の長さを取得して、文字数を表示しています。
全角も半角も1文字としてカウントする設定ではなく、半角1文字、全角2文字としてカウントする方法については、JavaScriptのcharCodeAtメソッドを使用して文字列をUnicodeで解析し、文字列の長さを計算する必要があります。具体的な実装方法については、コード例を参考にしてください。

20090503q
お礼率13% (4/29)

JavaScript
回答数4
ありがとう数0

みんなの回答 （4）
専門家の回答

質問者が選んだベストアンサー

ベストアンサー

神崎渉瑠（@taloo）
ベストアンサー率44% (1016/2280)

2009/05/07 06:47 回答No.3

> これを半角一文字、全角二文字という風に設定したいのですがどうすればいいのでしょうか？ JavaScriptで扱っている文字はUTF-8ですが、UTF-8における「半角カナ」は、1バイトではなく3バイトですので、 fromCharCodeAt()で１文字ずつ文字コードを取得して、半角文字に含まれる文字コードなら「半角１文字」、それ以外なら「全角１文字」として数えるしかないと思います。改行やスペースなどの「表示されない文字」は一般的には０文字ですが、データとして入っていますので、それを１文字とするか０文字とするかも、文字コードから確認するしかないと思います。 This is a pen. -> 11文字？ 14文字？ <script charset="Shift_JIS" src="test.js">という指定が、HTML、JavaScriptの文法上は可能ですが、殆どのブラウザが、charsetが未実装のようで、"ア".charCodeAt(0)はShift_JISの0xB1になりません。＊BBSの仕様上、投稿時に半角カナが全角に変換されるようです

その他の回答 (3)

yuu_x
ベストアンサー率52% (106/202)

2009/05/10 02:05 回答No.4

function tyek( str ) { var hc = str.match( /[\u0009\u000B\u0020-\u007E\uFF61-\uFF9F]/g ) || []; var rc = str.match( /(:?\u000D|\u000A|\u000D\u000A)/g ) || []; document.getElementById( 'inputlength' ).innerHTML = ( str.length - rc.length ) * 2 - hc.length + '文字'; }