作成日:2017-12-07, 更新日:2018-02-15
基本
「maxlength」を使えばOK(maxlengthの値が大きいと望ましくない結果になることもある)
日本語入力確定後、maxlengthを超えた文字たちは消される。半角なら入力ができなくなる。
※現在(2017/12/19時点)では知らないが、一部の携帯端末では、maxlengthが文字数じゃなく、バイト数になる。
文字数の確認(Jquery)
$(〇〇〇).on('input', 〇〇〇, function(){ // 文字数 → $(this).val().length; });
文字数の確認だけ。
例えば、「テキストフィールドの下のスペースに文字数を表示」なら良いけど、「テキストフィールドの中身の文字をゴニョゴニョ」するとなると注意が必要。
※未確定の日本語が消えたり、ダブったり、順番が入れ替わったり・・・色々と注意が必要
maxlengthの注意
・改行も文字数としてカウントされる
・maxlengthの値が大きくなると・・・制限を軽く超えて入力できることがある
・ブラウザによっては文字数じゃなくバイト数になる(※現在(2017/12/19時点)では知らないが、一部の携帯端末では、maxlengthが文字数じゃなく、バイト数)
maxlengthの代案
「IME関連)日本語入力中」「IME関連)日本語入力後、確定」「コピペした場合」なども考慮すると下記のどちらか。
※単純に文字数のカウントだけなら、上記の内容でOK。
・keyupとかのイベントを拾ってゴニョゴニョする
・keyupとかのイベントを拾わずにゴニョゴニョする
keyupとかのイベントを拾ってゴニョゴニョ
面倒だから諦める。
各ブラウザごとによって異なってくるので、自前で用意するのは面倒。どっかの誰かが手ごろなライブラリを用意してくれているはず・・・。
keyupとかのイベントを拾わずにゴニョゴニョ
文字入力以外でイベントを拾う感じ。
この手のヤツってformで何かを送るって感じだから「送信(or 内容確認)ボタン」ってのがあると思う。
その「送信(or 内容確認)ボタン」にクリックイベントで文字数チェック。