【Cut&Tryで辿り着いたスクリプティング】2
タイトル画像を造ってみました。
HTML5の<input…>タグの属性 type="number" では入力モード、入力幅の指定がブラウザやプラットフォームに因って動作に違いがあります。
《入力モード(入力画面)》
MacOS10.6.8 (Safari)は、数字入力画面が無いので数字になりません。入力モードが変わらないためです。
iOS9.3.5 (Safari)も入力モードは変わりませんが、数字入力画面が有るので、数字入力ボードになってます。
Windows7 (IE11、Firefox)は、IMEがオフになり、英字入力モードになります。
Android5.1.1 (Chrome、Firefox)は、 英語と顔文字などで使用頻度の高い言語3語(仏語、露語、ギリシャ語)のみの確認ですが、複数の文字を割り当ててない共通の数字入力モードになりました。
《入力幅》
Safari (MacOS10.6.8)、IE11 (Windows7)
size="*"
指定しないとデフォルト?で、
*を 20 とした時と同じくらい。
Safari (iOS)、 Chrome (Android5.1.1)
min="-**" max="**"
**に指定した数字の桁の大きい方。
FireFox (Windows7, Android5.1.1)
指定方法が判らず小さくできません。
《使用感》
各環境とも、タグ中の解釈されない属性は無視してくれてますので、入力幅の課題は Firefox だけ。
数字入力は IME が切り替ってくれたほうが楽です。
iOSでもモードは変わらないため、日本語入力モードで「11」などの同じ数字入力では、キーボード設定を「フリックのみ」にすると余程良くなります。課題は半確定状態から確定にするのにワンアクション必要である事。
Android5.1.1 (Chrome、Firefox)は各語キーボードセットに半確定モードのない数字のみ入力ボードがあり問題無し。