web-dev-qa-db-ja.com

HTML5入力type = "number"をダッシュ​​を受け入れるようにする

HTMLフォームに数値入力タイプを使用したい。

残念ながら、実数のみを受け入れ、ダッシュは受け入れません。

「1234-123456789」のような数字を入力できるようにする方法はありますか？

htmlmobileinputkeyboard
12
alexwenzel

最近同じ問題が発生しました。 type = "text"やtype = "number"の代わりにtype = "tel"を使用して回避しました。 'tel'を使用することで、モバイルデバイスで数字のみのキーボードを取得でき、それでもpattern = "[0-9 \-] +"を使用できました。

これが私が使用したコードです。私はこれがあなたが必要とするものに十分であることを願っています。パターン属性を追加すると、type属性によって設定された組み込みパターンがオーバーライドされるようにする必要があります。

<input id='zipcode' name='zipcode' type='tel' pattern="[0-9\-]+" placeholder='Zip-code'>

もちろん、これは、ダッシュと場合によっては括弧だけが必要な場合にのみ機能します。

14
metamilo

値が検証される正規表現を使用できます。単にpattern属性に入れてください。また、これを使用するには、入力のtypeをtextに変更する必要があります。

 <input type="text" pattern="[0-9]+([-\,][0-9]+)?" name="my-num"
               title="The number input must start with a number and use either dash or a comma."/>
4
Dhru 'soni