Gibt es in HTML ein Validierungsattribut für die Mindestlänge?

Lesezeit: 5 Minuten

Benutzeravatar von Emilan
Emil

Es scheint die minlength Attribut für ein <input> Feld geht nicht.

Gibt es ein anderes Attribut in HTML, mit dessen Hilfe ich die minimale Länge eines Werts für Felder festlegen kann?

  • Es wird nicht die Antwort für jedes Feld sein, aber wenn Sie nur sicherstellen möchten, dass ein Wert vorhanden ist, können Sie das Attribut “erforderlich” verwenden.

    – Keiner

    30. August 2012 um 22:55 Uhr


  • Mögliches Duplikat: stackoverflow.com/questions/5533053/textarea-character-limit/…

    – Webdesigner

    25. Februar 2013 um 21:03 Uhr

  • Es existiert nicht, aber machen wir viel Aufhebens und holen es ein! w3.org/Bugs/Public/show_bug.cgi?id=20557

    – Eric Elliott

    23. September 2013 um 4:01 Uhr

  • Sie müssen JS/Jquery verwenden, wenn Sie eine vollständige Implementierung durchführen möchten (z. B. erforderlich, Mindestlänge, Fehlermeldung beim Senden usw.). Safari unterstützt immer noch nicht einmal das erforderliche Attribut vollständig, und nur Chrome und Opera unterstützen minLength. zB siehe caniuse.com/#search=erforderlich

    – rmcsharry

    13. Oktober 2016 um 12:22 Uhr

Benutzeravatar von user123444555621
Benutzer123444555621

Du kannst den … benutzen pattern Attribut. Die required Attribut wird ebenfalls benötigt, sonst wird ein Eingabefeld mit leerem Wert ausgeschlossen Beschränkungsvalidierung.

<input pattern=".{3,}"   required title="3 characters minimum">
<input pattern=".{5,10}" required title="5 to 10 characters">

Wenn Sie die Option erstellen möchten, das Muster für “leer oder minimale Länge” zu verwenden, können Sie Folgendes tun:

<input pattern=".{0}|.{5,10}" required title="Either 0 OR (5 to 10 chars)">
<input pattern=".{0}|.{8,}"   required title="Either 0 OR (8 chars minimum)">

  • +1 für die Verwendung von html5 anstelle von jQuery. Ich wollte nur hinzufügen, dass Sie mit dem Titelattribut festlegen können, dass die Nachricht dem Benutzer angezeigt wird, wenn das Muster nicht erfüllt wird. Andernfalls wird eine Standardnachricht angezeigt.

    – Keiner

    30. August 2012 um 22:46 Uhr

  • @J.Money Es heißt immer noch “Bitte passen Sie das angeforderte Format an: “. Gibt es eine Möglichkeit, die vorherige Standardnachricht zu umgehen?

    – CᴴᴀZ

    1. Oktober 2013 um 7:52 Uhr

  • Leider ist dies für Textareas nicht unterstützt.

    – Meister der Diebe

    15. November 2013 um 23:35 Uhr

  • @ChaZ @Basj Sie können eine benutzerdefinierte Fehlermeldung hinzufügen, indem Sie das folgende Attribut hinzufügen: oninvalid="this.setCustomValidity('Your message')"

    – bigtex777

    26. November 2014 um 20:31 Uhr

  • Wenn Sie eine ungültige Eingabe machen und verwenden setCustomValidity, dann zeigt es Ihnen auch nach Korrektur der Eingabe weiterhin die Fehlermeldung an. Sie können Folgendes verwenden onchange Methode, dem entgegenzuwirken. oninvalid="this.setCustomValidity('Field must contain min. 5 characters')" onchange="try{setCustomValidity('')}catch(e){}"

    – sohaiby

    24. Oktober 2015 um 8:56 Uhr


Benutzeravatar von rhgb
rgb

Dort ist a minlength Eigentum ein die HTML5-Spezifikation jetzt, sowie die validity.tooShort Schnittstelle.

Beide sind jetzt in den neuesten Versionen aller modernen Browser aktiviert. Einzelheiten finden Sie unter https://caniuse.com/#search=minlength.

  • Ich sehe das, aber es funktioniert immer noch nicht für mich. Ich habe auch Set benötigt, aber immer noch nicht gegen die Minlänge validiert. nicht sicher warum.

    – ggedde

    23. Juni 2022 um 19:48 Uhr

Benutzeravatar von Ali Çarıkçıoğlu
Ali Çarıkçıoğlu

Hier ist eine reine HTML5-Lösung (wenn Sie minlength 5, maxlength 10 Zeichen Validierung wünschen)

http://jsfiddle.net/xhqsB/102/

    <form>
      <input pattern=".{5,10}">
      <input type="submit" value="Check"></input>
    </form>

  • Wie lege ich eine benutzerdefinierte Fehlermeldung fest, wenn das Feld nicht in Ordnung ist?

    – Basj

    7. Oktober 2014 um 20:47 Uhr

  • Für benutzerdefinierte Nachricht hinzufügen title Attribut mit der gewünschten Nachricht.

    – Shlomi Hassid

    13. Juni 2015 um 11:57 Uhr

  • Das gleiche pattern Die Antwort wurde einige Monate zuvor gegeben. Wie ist diese Antwort besser?

    – Dan Dascalescu

    1. September 2015 um 0:58 Uhr

  • @DanDascalescu Er hatte keine Formular-Tags und keine klare Erklärung. Ich habe auch eine funktionierende jsfiddle-Demo beigefügt. (Übrigens besagen Stackoverflow-Regeln, dass es nicht verboten ist, ähnliche Antworten zu geben, solange es für die Community hilfreich ist.)

    – Ali Çarıkçıoğlu

    27. Januar 2019 um 13:55 Uhr


  • Eine Möglichkeit, eine noch bessere Antwort zu geben, besteht darin, die Demo hier auf SO als einzufügen ausführbares Code-Snippet.

    – Dan Dascalescu

    27. Januar 2019 um 21:15 Uhr

Benutzeravatar von Sohel Ahmed Mesaniya
Sohel Ahmed Mesaniya

Ja, da ist es. Es ist wie maxlength. W3.org-Dokumentation:
http://www.w3.org/TR/html5/forms.html#attr-fe-minlength

Im Fall minlength funktioniert nicht, verwenden Sie die pattern Attribut wie von @Pumbaa80 für die erwähnt input Schild.

Für Textbereich:
Zur Einstellung max; verwenden maxlength und gehen Sie für min zu diesem Link.

Hier finden Sie sowohl für max als auch für min.

Benutzeravatar von benaff033
benaff033

Ich habe maxlength und minlength mit oder ohne verwendet required und es hat für mich sehr gut für HTML5 funktioniert.

<input id="passcode" type="password" minlength="8" maxlength="10">

`

minlength -Attribut wird jetzt weitgehend unterstützt in die meisten Browser.

<input type="text" minlength="2" required>

Aber wie bei anderen HTML5-Funktionen fehlt IE11 in diesem Panorama. Wenn Sie also eine breite IE11-Benutzerbasis haben, sollten Sie die Verwendung von in Betracht ziehen pattern HTML5-Attribut, das fast flächendeckend unterstützt wird in die meisten Browser (einschließlich IE11).

Um eine schöne und einheitliche Implementierung zu haben und vielleicht erweiterbar oder dynamisch (basierend auf dem Framework, das Ihr HTML generiert), würde ich für die stimmen pattern Attribut:

<input type="text" pattern=".{2,}" required>

Es gibt noch ein kleiner Usability-Haken beim Benutzen pattern. Dem Benutzer wird bei der Verwendung eine nicht intuitive (sehr allgemeine) Fehler-/Warnmeldung angezeigt pattern. Sehen diese jsfiddle oder darunter:

<h3>In each form type 1 character and press submit</h3>
</h2>
<form action="#">
  Input with minlength: <input type="text" minlength="2" required name="i1">
  <input type="submit" value="Submit">
</form>
<br>
<form action="#">
  Input with patern: <input type="text" pattern=".{2,}" required name="i1">
  <input type="submit" value="Submit">
</form>

In Chrome (aber ähnlich in den meisten Browsern) erhalten Sie beispielsweise die folgenden Fehlermeldungen:

Please lengthen this text to 2 characters or more (you are currently using 1 character)

durch die Nutzung minlength und

Please match the format requested

durch die Nutzung pattern.

Benutzeravatar von Peter Mortensen
Peter Mortensen

Ich stelle fest, dass manchmal in Chrome, wenn das automatische Ausfüllen aktiviert ist und die Felder von der integrierten Methode des Autofill-Browsers ausgefüllt werden, die Validierungsregeln für die Mindestlänge umgangen werden. In diesem Fall müssen Sie das automatische Ausfüllen durch das folgende Attribut deaktivieren:

autocomplete=”aus”

<input autocomplete="new-password" name="password" id="password" type="password" placeholder="Password" maxlength="12" minlength="6" required />

1441490cookie-checkGibt es in HTML ein Validierungsattribut für die Mindestlänge?

This website is using cookies to improve the user-friendliness. You agree by using the website further.

Privacy policy