32

<input type="number" />「上下」ハンドラーと組み合わせた奇妙な入力ボックスを出力するOperaで試してみました。私が期待していたのは、フォーカスするとアルファベットの代わりに数字のキーボードが表示される通常のテキスト フィールドでした。それは可能ですか？

ps 検証しようとしていません。素晴らしいユーザー エクスペリエンスになるでしょう。それだけです。

4

6 に答える 6

47

使用するpattern="[0-9]*"

  • 数値入力例:<input type="number" pattern="[0-9]*" />

  • 電話入力の例:<input type="tel" pattern="[0-9]*" />

注:サポートされていないブラウザーは、type="tel"デフォルトでテキスト タイプになります。

注意:を使用type="number"すると、クレジット カード、郵便番号、および電話入力の一部のブラウザーやユーザー エクスペリエンスで、ユーザーが句読点やコンマを出力に入力する必要がある場合に問題が発生する可能性があります。

参考文献:

于 2014-11-18T22:40:57.817 に答える
20

電話番号を処理する公式の HTML5 の方法は次のとおりです。

<input type="tel">

を使用したときに Opera で得られた「奇妙な入力ボックス」が気に入らなかったかもしれませんが、<input type="number" />訪問者に数値の入力を要求する場合は、これが適切なタイプの入力領域です。

于 2010-07-30T04:20:37.423 に答える
12

type="number" は HTML5 であり、多くの電話は HTML5 をサポートしていません。通話リンクの場合、type="tel" または を使用できます <A href="wtai://wp/mc;600112233">Special A</A>。CSS WAP 拡張機能 (56 ページ)も参照してください。

EDIT 10/2015:
すべてではないにしてもほとんどのスマートフォンが HTML5 と CSS3 をサポートしているため、これtype="number"が最善の方法です。

于 2010-07-30T10:13:48.807 に答える
10

この投稿は現在無効です。現在、すべてのスマートフォンが HTML5 と CSS3 をサポートしているため、実際に type="number" を追加すると、数字パッドがポップアップ表示されます。2 つの異なる Android バージョンと iPhone で確認しました。将来、正しい HTML5 形式の代わりに WAP を試す人がないようにします。

于 2014-07-03T16:41:41.747 に答える