rm /blog

IT系技術職のおっさんがIT技術とかライブとか日常とか雑多に語るブログです。* 本ブログに書かれている内容は個人の意見・感想であり、特定の組織に属するものではありません。/All opinions are my own.*

【HTML】MAXLENGTH指定における文字数オーバー分の漢字変換扱い

INPUTでTYPE=TEXTの場合に設定するMAXLENGTHプロパティによる、
最後の文字の入力制御のされ方がブラウザによって違うようだ。


 

 


下記にINPUTタグTYPE=TEXT、MAXLENGTH=10のタグを用意する。

MAXLENGTHが10なので、10文字までしか入らない。
だから「あいうえおアイウエオ」までしか入らない(”まで”って次の文字なんだよって感じもあるが…)

このとき、「あいうえおアイウエ愛」という文字を打ちたいとする。
ただ「あいうえおアイウエ」まで入力した段階で9文字になっており、
続けて打ちたい「愛」に関しては漢字に変換する前に"あい"2文字を必要とするため、
一時的に(最後の文字を漢字に変換する前に)「あいうえおアイウエあい」11文字となってMAXLENGTHの幅を超える。
このとき、飛び出した"い"、強いて言うなら入力中の"あい"の文字の扱い方がIEとそれ以外で違う。

IE(11)Fire Fox(44.0.2)Google Chrome(49.0.26)

「あいうえおアイウエオあ」で止まり「い」入力時点で「い」が消える。つまり、漢字変換の余地を受け付けない 「あい」部分が変換候補となって表示され、実際に変換できる。最終的に「あいうえおアイウエオ愛」にできる 「あい」部分が変換候補となって表示され、実際に変換できる。最終的に「あいうえおアイウエオ愛」にできる※Fire Foxと同じ

となる。

結果だけ見るとまたIEだけか…って感じではあるが
Fire FoxとGoogle Chromeの動きを見るとそれはそれで「う~ん…」って印象を受ける。
上記に補足しておくとFire FoxとGoogle Chromeは、
入力段階ではいくらでも文字を入力して(MAXLENGTHを無視して)飛びだすことが可能である。
たとえば「あいうえおアイウエあいあいあいあいあいあいあいあいあいあいあいあいあいあいあいあいあいあいあい」のような文字列も、入力するだけなら可能なのである。
ここまで入力して、最後にEnter押すと「あいうえおアイウエあ」になる。
ユーザに対して明示的に「○○文字まで入力可能」と銘打っていない場合(得てしてユーザはそんな表記していても見ないものだが)、
いくらでも文字が入力できるように見えるくせしてEnter押したら入力した分が消える、
っていうのはブラウザ的にはどーなのかな、という気が正直する。
まあそういう意味でいえば入力の余地がないIEも同じか。
MAXLENGTHの存在をどこまでユーザに明確に開示しているかというのが重要なポイントなのか。




ちなみにIEって昔はこういう動きではなかった気がする。
=上記でいうところのFire Fox、Google Chromeと同じ動きをした記憶がある。
IE7とかIE6とかの時代の話しだが。
今ちょっとしたWebシステムで試してみたが互換表示の有無でも同じだった(IE11)。

と思ってちょっとググったらMicrosoftのほうでこの件に関する情報公開があったようだ。
この記事からするとIE11からの問題なのか?(IE10までは大丈夫だったとか?)
この記事によればX-UA-Compatibleの指定をIE9以前に変えればいいらしい(関連)が、
WEBシステムによっては対応するの難しいだろうな~これ……
IE以外サポートしてませんってシステムたまに見るけど
そういうとこだと「仕様っすwww」って回答になってしまうんだろうな~…
切ないなあ~~