私は、「1-2 * 3 + 4」などの文字列を入力できる入力フィールドを備えたWebサイトを作成しています。モバイルデバイス用のテンキーも表示したいです。
<input type="number">
Webkitブラウザーは上記の例を無効にするため、機能しません(記号が含まれているため)。 上記以外のテンキーを表示する代替手段はありますか? (type = "tel"には-記号は含まれません)
編集: だから私は回避策を見つけました:
$(".myInput").focus(function(){
$(this).get(0).type = "text";
});
$(".myInput").blur(function(){
$(this).get(0).type = "number";
});
入力がフォーカスされると、タイプをテキスト(少なくともiPhoneでは、テンキーが既に起動された後にこの変更が行われます)。フォーカスを失ったとき、タイプを数値に戻し、入力が再びフォーカスを取得した場合に再び機能するようにします。
私はまだ他の提案に興味があります。
回答:
回答№1は0残念ながら、テンキーまたは追加のキーを備えた数字キーボード(マイナス記号は含まれていますが、プラス記号は含まれていません)が付いています。
テンキーだけを実現するには:
<input type="number" pattern="[0-9]*" />
拡張キーボードを実現するには:
<input type="number" pattern="*" />
これについては、Appleで詳細をご覧ください。 Safariデベロッパーライブラリ.