Androidで、HTMLフォームにmaxlength属性を指定すると、文字入力できなくなる場合がある
公開日：
こんにちは。x-fitチーム・エバンジェリストの渡辺です。Android4.1のいくつかの端末で、フォームの文字入力ができなくなる事象が確認されたのでご紹介します。
確認された現象
- HTML上のフォームで、テキストボックスにmaxlength属性を指定しておきます。以下のようなコードで確認できます。
ソースコード例
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>maxlength attribute test</title> </head> <body> <form action="#"> <label for="ln">姓<input type="text" name="lastname" id="ln" maxlength="10"/></label><br/> <label for="fn">名<input type="text" name="firstname" id="fn" maxlength="10"/></label> </form> </body> </html>
- 端末からアクセスし、maxlengthで指定された文字数以上の文字を入力します（見た目上はmaxlength指定文字数以上は入力できません）。
- それ以降、フォーム内容の修正も、別フォームの入力もできなくなります。再読込みをしても解消できず、一度ブラウザを終了して、もう一度起動しなおす必要があります。
Galaxy Nexus（SC-04D）での表示。2段目のテキストボックスには、入力しても反映されていません。
原因と回避策
この現象そのものは、Android4.1.1のAndroidブラウザのバグではないかと報告されているものだと思われます。
ただ、弊社の確認できる範囲では、現象が発生しているのは下記の端末です。おそらく、下記の端末以外は、メーカーが手を入れて解消しているものと思われます。
- Galaxy Nexus(SC-04D)[Android 4.1] Build/JRO03C
- HONEY BEE(R)(201K)[Android 4.1] Build/117.1.1c00
maxlength属性は非常に多用されるものであるため、注意が必要です。現状での回避策は、maxlengthの使用をやめて、JavaScriptを使って文字数チェックを行うくらいでしょう。スマートフォン向けwebサイトでmaxlengthを使用している場合は、実機で確認してみることをお勧めします。
※本記事は、弊社開発チーム所有機での確認結果であり、全機種調査の結果ではありません。同一機種であっても、この現象が必ず発生することを保証するものではありません。これ以外や例外のある可能性がありますことをご了承ください。
タグ:
Tweet
