Ich habe gerade diese Diskussion auf Twitter mitbekommen, angestoßen von Dave.
Ich (codiere ein Formular): <input id="zip" type="number">
Kleiner Teufel (erscheint auf meiner Schulter): Jaaa! Ich liebe den Optimismus, schick es raus!
Ich: Moment, was machst du hier? Wird das auf mich zurückfallen? Was weißt du, was ich nicht weiß?— Dave SPOOPert (@davatron5000) 9. Oktober 2018
Es scheint, als wären Postleitzahlen nur Zahlen, oder? Also…
<input id="zip" name="zip" type="number">Der Vorteil liegt darin, kostenlose Validierung durch den Browser nutzen zu können und auf mobilen Geräten eine hilfreichere, zahlenbasierte Tastatur zu aktivieren.
Aber Zach wies darauf hin, dass type="number" für Postleitzahlen problematisch ist, da Postleitzahlen führende Nullen haben können (z. B. könnte eine Bostoner Postleitzahl 02119 sein). Filament Group hat auch eine kleine Bibliothek zur Behebung dieses Problems.
Das ist die perfekte Aufgabe für inputmode, wie Jeremy vorschlägt.
<input id="zip" name="zip" type="text" inputmode="numeric" pattern="^(?(^00000(|-0000))|(\d{5}(|-\d{4})))$">Aber die Unterstützung ist zum Zeitpunkt der Veröffentlichung ziemlich schlecht.
Ein paar Leute erwähnten den Versuch, type="tel" dafür zu missbrauchen, aber das hat seine eigenen Nachteile, wie z. B. die Ablehnung korrekt formatierter 9-stelliger Postleitzahlen.
Postleitzahlen sehen zwar wie Zahlen aus, werden aber wahrscheinlich am besten als Zeichenketten behandelt. Eine weitere Option ist, es bei einem text-Eingabefeld zu belassen, aber mit pattern Zahlen zu erzwingen, wie Pamela Fox dokumentiert.
<input id="zip" name="zip" type="text" pattern="[0-9]*">Wie viele in den Kommentaren angemerkt haben, ist es erwähnenswert, dass numerische Muster für Postleitzahlen am besten für die USA geeignet sind, da viele Codes für andere Länder Zahlen *und* Buchstaben enthalten.
Vergessen Sie nicht den Rest der Welt, der keine Postleitzahlen verwendet... Viele verwenden Postcodes, die eine Mischung aus Zahlen und Buchstaben sein können.
Ich denke, die beste Lösung wäre, wenn möglich, das Pattern-Attribut basierend auf dem ausgewählten Land des Benutzers zu ändern oder zu entfernen. So können Menschen in Ländern wie den USA mit rein numerischen Postleitzahlen ihre Validierung zur Vermeidung von Fehlern nutzen, aber Menschen in anderen Teilen der Welt werden nicht eingeschränkt.
Obwohl Postleitzahlen Zahlen sind, verwendet der Rest der Welt Postcodes, die eine Mischung aus Zahlen und Buchstaben sein können. Für jemanden, der NUR in den USA ansässig ist, ist das in Ordnung, aber ein sehr großes Problem, wenn man international tätig ist.
Das Problem bei der letzten Option ist, dass das Muster keine Bindestriche zulässt, die benötigt werden, wenn Sie 9-stellige Postleitzahlen unterstützen möchten.
Auch das Regex-Pattern in Jeremys Inputmode-Vorschlag sieht für mich sehr falsch aus. Ich bin mir ziemlich sicher, dass es so einfach sein kann:
(Treffer, wenn die Eingabe genau 5 Ziffern ist, oder optional Treffer, wenn die Eingabe genau 9 Ziffern mit einem Bindestrich nach der 5. Ziffer ist)
Oder, wenn Sie **extrem** permissiv sein wollen.
(Gleich wie zuvor, aber Leerzeichen davor und danach zulassen, Leerzeichen nach der 5. Ziffer zulassen und einen Bindestrich nach der 5. Ziffer zulassen, aber nicht erzwingen)
Schade, dass die Tastatur auf Mobilgeräten für
input="tel"keinen Bindestrich enthält, denn es wäre schön, ein Ziffernfeld für Posteingaben auslösen zu können. Erlaubtinputmode="numeric"Bindestriche? Ich habe keine Möglichkeit, es zu testen, um zu sehen, wie die Tastatur aussieht.Ich kann nicht glauben, dass die Unterstützung dafür immer noch so schlecht ist. Ich habe vor etwa 4 Jahren eine Präsentation über solche Eingabeverhalten gehalten!
Es gibt immer noch keine richtige Lösung und wir verwenden Hacks wie type="tel" für eine der häufigsten Eingabearten im Web :)
Ich schätze, man sollte nie außerhalb der USA versenden? Kanada hat Buchstaben in seinen Postleitzahlen, und andere Länder folgen nicht dem gleichen Ziffernformat.
US 9-stellige Postleitzahlen haben einen Bindestrich zwischen der führenden 5-stelligen und der nachfolgenden 4-stelligen Gruppe. Kanadische Postleitzahlen haben Buchstaben, sind 6-stellig, mit einem Leerzeichen zwischen Dreiergruppen. Andere Länder variieren ebenfalls. Sie müssen wissen, welches Land, bevor Sie eine Menge Struktur oder Einschränkungen auferlegen können.
Nur um zu erwähnen, dass einige Orte sogar Buchstaben in ihren Postleitzahlen haben könnten. Zum Beispiel haben die Åland-Inseln AX vor einer 5-stelligen Zahl, wie AX22100 für die Stadt Mariehamn. Normalerweise funktioniert es gut ohne AX, könnte aber in Lund in Schweden enden, das dieselbe Nummer (22100) teilt.
Denken Sie auch daran, dass Postleitzahlen das optionale 9-stellige Format mit einem Bindestrich (zip+4) verwenden können. Internationale Postleitzahlen haben unterschiedliche Längen und einige enthalten Leerzeichen und Buchstaben oder sind variabel lang (siehe UK und Kanada). Einige Länder haben überhaupt keine Postleitzahlen.
Der scharfsinnige Programmierer wird feststellen, dass nicht jedes Land rein numerische Postleitzahlen verwendet.
Dieser Vorschlag ist ziemlich USA-spezifisch. Die meisten Länder der Welt verwenden Postcodes mit einer Kombination aus Buchstaben und Zahlen und nennen sie nicht Zip, was ein USPO-Markenname ist. Jeder HTML-Eingabetyp sollte type="postal" sein und eine Vielzahl von Mustern akzeptieren. Wenn Sie nicht alle Ihre Kunden im selben Land haben, müssen Sie ein offenes Muster verwenden. Oder geben Sie das Muster nach dem Ausfüllen des Länderfeldes an.
Folgen Sie einfach dem Robustheitsprinzip und akzeptieren Sie alles. Mit Ihrer cleveren Abgleichung schließen Sie den Rest der Welt aus...
Zipps in den Niederlanden sind wie Zahl Zahl Zahl Zahl Buchstabe Buchstabe
Außerdem ist die Welt nicht nur die USA.
Postleitzahlen variieren. In den Niederlanden zum Beispiel sind es 4 Zahlen und 2 Buchstaben.
Einfache(r) Weg(e), eine Zahl zu identifizieren
Eine "Zahl" muss einen Wert haben.
Wenn es keinen Sinn macht, damit zu rechnen, ist es keine "Zahl".
Das Muster "[0-9]*" funktioniert international nur für einige Postleitzahlen.
https://en.wikipedia.org/wiki/List_of_postal_codes
Postleitzahlen in anderen Ländern folgen nicht dem von Ihnen vorgeschlagenen Format.
Zum Beispiel ist es hier im Vereinigten Königreich so etwas wie AB123CD.
https://en.m.wikipedia.org/wiki/List_of_postal_codes
Das ist nur aus US-amerikanischer Sicht wahr. Schauen Sie sich einfach das britische Postleitzahlensystem an: https://en.wikipedia.org/wiki/Postcodes_in_the_United_Kingdom, das alphanumerische Werte verwendet.
Je nachdem, welche Länder Sie abdecken, funktionieren Ihre Vorschläge auch nicht, da einige Postleitzahlen ebenfalls aus alphanumerischen Zeichen bestehen: https://en.wikipedia.org/wiki/Postal_code#Alphanumeric_postal_codes
Internationale Adressen enthalten oft Buchstaben in ihren Postleitzahlen-Äquivalenten (z. B. Postcodes), das ist also eine weitere Überlegung, wenn Sie mehr als nur die USA bedienen wollen.
Das Muster für Postleitzahlen hängt vom Land ab, in dem Sie sich befinden. Nur Zahlen zuzulassen, könnte einige Ihrer internationalen Kunden ausschließen.
Postleitzahlen sind keine Zahlen. Zahlen sind Entitäten, mit denen man rechnen kann. Währungen und Prozentsätze sind also Zahlen, und Postleitzahlen, Haus- und Telefonnummern sind Zeichenketten.
Vergessen Sie auch nicht, dass der Rest der Welt Buchstaben in Postleitzahlen verwendet... die Verwendung von type=number scheitert natürlich völlig. Ich habe es schon mehr als einmal gesehen und konnte keine legitimen Adressinformationen angeben, weil es so war. Das andere verwandte Problem (normalerweise JS-Validierung) ist, dass nicht-US-Telefonnummernformate nicht zugelassen werden, sodass keine korrekte Telefonnummer angegeben werden kann. Beides ist im Jahr 2018 immer noch erstaunlich verbreitet.
Sie werden Buchstaben benötigen, wenn Sie außerhalb der USA unterstützen. Sowohl britische als auch irische Postleitzahlen sind alphanumerisch :)
Ich dachte, nur Nordirland (das sowieso Teil des Vereinigten Königreichs ist) verwendet Postcodes, und dass die Republik Irland überhaupt keine verwendet?
Nur als Haftungsausschluss: Dies funktioniert nur in den USA (und möglicherweise einigen wenigen anderen Ländern), aber zum Beispiel im Vereinigten Königreich enthalten alle Postleitzahlen Buchstaben. Selbst die grundlegende Postleitzahlenvalidierung wird dadurch schwieriger :)
Beschränken Sie das Postleitzahlenfeld bitte nicht nur auf Ziffern. Einige Länder haben Buchstaben in der Postleitzahl. In den Niederlanden besteht die Postleitzahl aus 4 Ziffern und 2 Buchstaben, z. B. 3012 KJ. https://en.wikipedia.org/wiki/List_of_postal_codes
Nein, bitte tun Sie das nicht (oder ändern Sie das Verhalten bezüglich des Landes des Benutzers): https://en.wikipedia.org/wiki/Postal_code#Alphanumeric_postal_codes
Das ist in Ordnung, wenn Ihre Zielgruppe in den USA ansässig ist. Im Vereinigten Königreich wird ein "Zip"-Code jedoch als "Postal Code" bezeichnet und enthält Buchstaben, Zahlen und Leerzeichen. In Südirland gibt es kein Zip-/Postal-Code-System. Wenn Ihr Formular internationalisiert werden muss, ist es wahrscheinlich besser, keine Validierung dafür vorzunehmen.
Das funktioniert wahrscheinlich nur bei einer rein US-amerikanischen Benutzerbasis. Ich lebe in den Niederlanden und die Postleitzahlen hier sind formatiert wie
0000AA(vier Zahlen, 2 Buchstaben).Bitte bedenken Sie, dass wir nicht alle numerische Postleitzahlen haben.
In den Niederlanden verwenden wir dieses Format: "1234 AB".
- 4 Zahlen, nicht beginnend mit einer 0.
- Optionales Leerzeichen.
- 2 Buchstaben, die niemals SA/SD/SS enthalten.
Der reguläre Ausdruck wäre:
/^[1-9][0-9]{3} ?(?!sa|sd|ss)[a-z]{2}$/i
Dies ist möglicherweise kein Problem für einen lokalen Webshop, aber wenn Sie im Ausland verkaufen wollen, ist es vielleicht keine gute Idee, zu viele Einschränkungen bei den Eingaben vorzunehmen ;)
Internationale Postleitzahlen können/werden Buchstaben enthalten.
In vielen Ländern (wie z.B. Großbritannien) gibt es auch Buchstaben in den Postleitzahlen! Daher wäre auch mit dem Muster zu restriktiv, wenn Sie für internationale Kunden entwerfen.
Kanada und viele andere Länder haben Buchstaben in ihren Postleitzahlen, daher würde eine Zahl für eine Postleitzahl nie funktionieren.
Als britischer Einwohner, der mit amerikanischen Websites zu tun hatte (einschließlich der Dell-Support-Website, die die Eingabe einer Postleitzahl verlangt), ist die Annahme "Postleitzahlen sind Zahlen" ein großer Fehler.
Britische Postleitzahlen (ähnlich wie in einigen anderen Ländern) enthalten Buchstaben, z. B. AB12 3CD, und es gibt noch ein paar andere lustige Varianten.
Vergessen Sie nicht, auch außerhalb der USA zu berücksichtigen! Britische "Zipcodes" (Postcodes für uns!) enthalten sowohl Zahlen als auch Buchstaben. Ich würde mich sehr ärgern, wenn ein Formular keine Buchstaben zulassen würde. Vielleicht könnte eine clevere Mustererkennung verwendet werden, um zu bestimmen, für welches Land der Code bestimmt ist, und eine Nachricht oder Warnung ausgeben.
Aber vielleicht ist das übertrieben und ein Label würde reichen... etwas zum Nachdenken!
Und dann haben wir noch Buchstaben in kanadischen Postleitzahlen (z. B. H2R3N9).
In einigen europäischen Ländern können Postleitzahlen Buchstaben und Leerzeichen enthalten, wie z.B.: 1234 AB.
Ich bleibe bei input text, wenn ich validiere, dann basierend auf dem Land und selbst dann kann es schwierig sein.
Ähm... Es ist wichtig zu beachten, dass ja, die USA haben rein numerische Postleitzahlen. Andere Länder... nicht so sehr.
Betrachten Sie Großbritannien, wo die Postleitzahl "WC2N 5DU" sein kann.
Jetzt mach das mal für Großbritannien :P
Das ist urkomisch, die Leute sind wütend. Wenn es eine Sache gibt, die Programmierer hassen, dann sind es Annahmen über die Umstände :)
In Polen (und einigen anderen kleinen/mittelgroßen Ländern) enthalten Postleitzahlen Bindestriche (z.B. 03-123 Warschau, der Hauptstadt Polens).