web-dev-qa-db-ja.com

IDを入力するには<input type = "number">または<input type = "text">?

私のウェブサイトには、長いランダムな数値IDを入力するための入力ボックスがあるフォームがあります。テキスト入力か数値入力か?

<input type="number">の問題は、上/下のスピナー矢印が役に立たないことです。 ID番号は長くランダムなので、番号を増減する必要があるのは誰ですか?

ただし、<input type="text">はユーザーが数字以外の文字を入力できるため、不適切です。

どちらが良いですか?

6
clickbait

WHATWG HTML仕様 には、まさにこの状況に関する注記があります。そのメモによると、これはinput type="number"の適切な使用ではありません。

type=number状態は、たまたま数字だけで構成されていて、厳密には数字ではない入力には適していません。たとえば、クレジットカード番号や米国の郵便番号には不適切です。 type=numberを使用するかどうかを決定する簡単な方法は、入力コントロールにスピンボックスインターフェイスがある(たとえば、「上」および「下」の矢印が付いている)ことが理にかなっているかどうかを検討することです。クレジットカード番号を最後の桁で1ずつ間違って取得することは、小さな間違いではなく、すべての桁を間違って取得するのと同じくらい間違っています。したがって、ユーザーが「上」および「下」ボタンを使用してクレジットカード番号を選択することは意味がありません。スピンボックスインターフェイスが適切でない場合、type = textがおそらく正しい選択です(おそらくpattern属性を使用します)。

数字のみを指定するためのpattern属性の使用はpattern="[0-9]+"のようになります。IDがちょうど32桁の場合はpattern="[0-9]{32}"のようになります。

5
Kevin Reid

Type = "number"を使用すると思います

次にスピナーを取り外します

-webkit-appearance: none;
-moz-appearance:textfield;

参照: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/numberhttps://developer.mozilla.org/en- US/docs/Web/CSS/-moz-appearance

これは、モバイルデバイスでは組み込みの「テンキー」で使用するためです。

-

[〜#〜]編集[〜#〜]

私はケビン・リードの答えに同意しません。理由をお話しします。

長い数字が必要な場合は、クレジットカードとしましょう。とにかく、読みやすさの理由から、スペースなどでフォーマットすることをお勧めします。電話番号と同じです。多くの人が番号の間に「一時停止」を入れて話すと​​きに番号を書きます。それを保存すると、数値のフォーマット方法と、スペース、ハッシュタグ、ダッシュなどのない数値の両方を保存できます。

その後、ofc。あなたはテキストを入力したいでしょう。

この質問でOPがIDについて話していました

次に、間違いなくtype = "number"があります。この場合、彼はスピナーを取り除いたかっただけです。

クレジットカード番号を最後の桁で1ずつ間違って取得することは、小さな間違いではなく、すべての桁を間違って取得するのと同じくらい間違っています。したがって、ユーザーが「上」および「下」ボタンを使用してクレジットカード番号を選択することは意味がありません。

クレジットカード番号はほとんどすべてのコストで非公開のままであるため、これは理にかなっています。しかし、それはメンバーIDに適用されるとは思わない。

8
Muqito

数値

単純な理由で、モバイルデバイスには数字キーボードが表示され、IDの入力がはるかに簡単になります。

パターン検証では、カスタムキーボードビューは提供されません。ほとんどのブラウザーでは、数値のみを入力できるように強制するのではなく、エラーメッセージのみを生成します。

1
allo