Zahleneingabetyp, der nur ganze Zahlen akzeptiert?

Question

Ich verwende die jQuery Tools Prüfer die HTML5-Validierungen durch jQuery implementiert.

Bis auf eine Sache hat es bisher gut funktioniert. In der HTML5-Spezifikation ist die Eingabe Typ "number" kann sowohl Ganzzahlen als auch Gleitkommazahlen enthalten.

Dies scheint unglaublich kurzsichtig zu sein, da es nur ein nützlicher Validator sein wird, wenn Ihre Datenbankfelder vorzeichenbehaftete Gleitkommazahlen sind (für vorzeichenlose Ints müssen Sie auf pattern Validierung und verlieren damit zusätzliche Funktionen wie die Auf- und Abwärtspfeile bei Browsern, die dies unterstützen).

Gibt es eine andere Eingabe Typ oder vielleicht ein Attribut das würde einschränken die Eingabe auf nur vorzeichenlos Ganzzahlen ?

Ich konnte keine finden.

---

Den Schritt auf 1 zu setzen ist keine Lösung, da dies die Eingabe nicht einschränkt. Sie können immer noch eine negative Gleitkommazahl in das Textfeld eingeben.

Außerdem bin ich mir der Mustervalidierung bewusst (ich habe sie in meinem ursprünglichen Beitrag erwähnt), aber das war nicht Teil der Frage.

Ich wollte wissen, ob HTML5 die Beschränkung einer Eingabe vom Typ "Zahl" auf positive ganzzahlige Werte erlaubt. Die Antwort auf diese Frage lautet offenbar "Nein, das ist nicht der Fall".

Ich wollte keine Mustervalidierung verwenden, da dies einige Nachteile bei der Verwendung von jQuery Tools Validierung, aber es scheint, dass die Spezifikation nicht für eine sauberere Art, dies zu tun.

Answer 1

Das Beste, was Sie mit HTML allein erreichen können ( Dokumentation ) :

<input type="number" min="0" step="1"/>

Answer 2

Stellen Sie die step Attribut zu 1 :

<input type="number" step="1" />

Dies scheint im Moment in Chrome ein wenig fehlerhaft zu sein, so dass es im Moment vielleicht nicht die beste Lösung ist.

Eine bessere Lösung ist die Verwendung der pattern Attribut, das einen regulären Ausdruck verwendet, um die Eingabe abzugleichen:

<input type="text" pattern="\d*" />

\d ist der reguläre Ausdruck für eine Zahl, * bedeutet, dass es mehr als einen von ihnen akzeptiert.

Answer 3

<input type="text" name="PhoneNumber" pattern="[0-9]{10}" title="Phone number">

Mit diesem Code wird die Eingabe in das Textfeld auf die Eingabe von Ziffern beschränkt. Pattern ist das neue Attribut in HTML 5.

Musterattribut doc

Answer 4

Der einfache Weg mit JavaScript:

<input type="text" oninput="this.value = this.value.replace(/[^0-9.]/g, ''); this.value = this.value.replace(/(\..*)\./g, '$1');" >

Answer 5

<input type="number" oninput="this.value = Math.round(this.value);"/>