5000164 is here

iOS のブラウザで数字のみのキーボードを出す

Published 2012.10.15 by 菅原 浩

iOS のブラウザにおいて数字のみのキーボードを出したいときがあります。
しかし、 input type="number" ってやっても数字以外のキーがでてきてしまう。
そうだ、 input type="tel" ってやれば数字のみになる、しかしセマンティックではない。

そこで、 input type="text" pattern="\d*"

HTML5 からは入力文字を pattern で正規表現を利用して制御できるようになりました。
そこで入力可能文字を数字のみにすると iOS で数字のみのキーボードを出してくれるというものです。
賢いですね。

というわけで、実演

1
<input type="number">
1
<input type="tel">
1
<input type="text" pattern="\d*">

以下、参考