html5 Formular-Validierung - verwenden Sie Muster auf optionales Feld

Ich habe ein optionales Formularfeld, das ich die neue html5 Musteroption verwenden möchte. Aber wenn ich das Muster hinzufüge, wird das Feld benötigt, obwohl ich nicht das erforderliche Attribut habe. Ich habe das Muster unten eingefügt. Ich möchte, dass der Benutzer das Feld leer lassen kann. Wenn der Benutzer jedoch etwas in das Feld eingibt, möchte ich, dass das Muster angewendet wird. Wie würde ich das erreichen? Danke im Voraus.html5 Formular-Validierung - verwenden Sie Muster auf optionales Feld

pattern="[-a-zA-Z '.,]{3,50}"

Quelle

2017-09-25 Xi Vix

Das Problem ist, dass {3,50} Begrenzungs quantifier in der Zeichenklasse definiert mindestens 3 Vorkommen der Zeichen erfordert.

Sie müssen das Muster optional machen. Wickeln Sie es mit einer optionalen Nicht-Erfassungsgruppe:

pattern="(?:[-a-zA-Z '.,]{3,50})?" 
     ^^^     ^^

HTML5 patterns werden mit dem Anker gewickelt automatisch, dh das Muster oben wird in ^(?:(?:[-a-zA-Z '.,]{3,50})?)$ übersetzt wird und wird

^(?: entsprechen - Anfang des Strings
(?:[-a-zA-Z '.,]{3,50})?-1 oder 0 Vorkommen von 3-50 Bindestriche, ASCII-Buchstaben, Leerzeichen, ', . oder ,
)$ - Ende der Zeichenfolge.

Quelle

2017-09-25 20:01:34

Erstaunlich. Vielen Dank. Sie sind HTML5-Genie. Ich vereinfachte es, indem ich das: an der Front entfernte. Und ich habe das Ende der Saite in deinem obigen Muster nicht gesehen. Die vereinfachte Version hat funktioniert. Gibt es einen Grund, warum ich einen String-Anfang und ein String-Ende brauche? –

@XiVix: Siehe [die Dokumente] (https://www.w3.org/TR/html5/single-page.html#the-pattern-attribute). Das Muster, das Sie in 'pattern' Attribut * verwenden, muss * mit dem gesamten String übereinstimmen, und somit sind die'^'und' $ 'in führenden/nachgestellten Positionen nicht notwendig. Deshalb habe ich sie nicht in das Muster aufgenommen. –

html5 Formular-Validierung - verwenden Sie Muster auf optionales Feld

Antwort

Verwandte Themen