Begrenzen Sie die Anzahl der zulässigen Zeichen in form input text field

Wie kann ich begrenzen oder einschränken der Benutzer nur geben Sie maximal fünf Zeichen in die textbox?

Unten ist das input-Feld als Teil meiner form:

<input type="text" id="sessionNo" name="sessionNum" />

Ist es mit so etwas wie maxSize oder sowas?

Hier <input type="text" maxlength="5"> demo: jsfiddle.net/mcBbW/1

InformationsquelleAutor BruceyBandit | 2011-12-17

160

maxlength:

Die maximale Anzahl von Zeichen, die akzeptiert als Eingabe. Diese kann größer sein, angegeben durch GRÖßE , in dem Fall das Feld
scrollt entsprechend. Die Standardeinstellung ist "unbegrenzt".
```
<input type="text" maxlength="2" id="sessionNo" name="sessionNum" onkeypress="return isNumberKey(event)" />
```
Jedoch, dies kann oder kann nicht beeinflusst werden durch den handler. Möglicherweise müssen Sie verwenden, oder fügen Sie einen anderen handler-Funktion, um zu testen, für die Länge, als auch.

Ich fand diese Antwort hilfreich, wenn die Begrenzung in der Eingabe-phase. Sie können auch einschränken, ist es in der phase der Validierung, wenn die übermittlung und pop-up-Validierung Nachricht mit der pattern Attribut. Siehe stackoverflow.com/questions/10281962/...

InformationsquelleAutor Jared Farrish

Der einfachste Weg, dies zu tun:

maxlength="5"

So.. Hinzufügen dieses Attribut, um Ihre Kontrolle:

<input type="text" 
    id="sessionNo" 
    name="sessionNum" 
    onkeypress="return isNumberKey(event)" 
    maxlength="5" />

InformationsquelleAutor Nonym

8

Fügen Sie folgende Kopfzeile:
```
<script language="javascript" type="text/javascript">
function limitText(limitField, limitNum) {
    if (limitField.value.length > limitNum) {
        limitField.value = limitField.value.substring(0, limitNum);
    }
}
</script>

    <input type="text" id="sessionNo" name="sessionNum" onKeyDown="limitText(this,5);" 
onKeyUp="limitText(this,5);"" />
```
this.form.sessionNo scheint ein wenig suspekt. Warum nicht einfach this? Auch limitCount und limitNum scheinen auch out-of-order/unnötig?
Korrigiert es. Tun auf diese Weise, wenn Sie wollte, es zu begrenzen, bestimmte Zeichen oder zahlen, die Sie konnten, aber wenn Sie nicht kümmern, dann max Länge würde funktionieren. Also, wenn Sie sagen wollten, dass die Werte zwischen 1-50 könnten Sie oder alle positiven zahlen, etc.
this.form.sessionNo immer noch nicht richtig erscheinen. this in diesem Zusammenhang auf die input, nicht document.
Immer noch nicht richtig, es nicht auf die form. this ist alles, was Sie brauchen. Auch technisch, wenn Sie wollen, um das element zu referenzieren, die von der form, es würde durch (form/input) name, nicht id, dh: document.formName.sessionNum.
Richtig ich tippte zu schnell, es war eingewickelt in der a-form vor. Aber Sie würden einfach die ref auf den Eingang in der Funktion den aktuellen Wert des Feldes fügen Sie einer Logik, die Sie wollen, zu begrenzen das Feld.

InformationsquelleAutor b3verelabs
7

Laut w3c, der default-Wert für das MAXLENGTH-Attribut ist eine unbegrenzte Anzahl. Also, wenn Sie nicht angeben der max könnte ein Benutzer Ausschneiden und einfügen die Bibel ein paar mal und kleben Sie es in das Formular.

Selbst wenn Sie tun, geben Sie die MAXLENGTH auf einen vernünftigen Wert stellen Sie sicher, überprüfen Sie die Länge der übermittelten Daten auf dem server vor der Verarbeitung (mit so etwas wie php oder asp) ist es ziemlich leicht zu bekommen, um die grundlegenden MAXLENGTH Einschränkung sowieso

Wie funktioniert ein user um max Länge???
es gibt mehrere Möglichkeiten, zu "umgehen" html - /javascript-Einschränkungen. Am einfachsten zu überprüfen ist öffnen Sie Ihre Seite mit Chrome "element untersuchen" und ändern Sie manuell die HTML. Der aufwändigere Weg, um mit - schreiben Sie ein Skript, dass die Daten posten, und ignoriert dabei irgendwelche Einschränkungen (mit curl-Bibliothek oder etwas ähnliches). Als backend-developer sollten Sie nie das Vertrauen frontend-Validierung der Daten - alle sollten die Regeln dupliziert auf dem server. Frontend-Validierung ist nur ein Weg, um Zeit zu sparen für den Benutzer mit dem Hinweis auf offensichtliche Fehler, ohne eine Anfrage an den server.

InformationsquelleAutor Mahdi Jazini

Ich immer es so machen:

$(document).ready(function(){
var maxChars = $("#sessionNum");
var max_length = maxChars.attr('maxlength');
if (max_length > 0) {
    maxChars.bind('keyup', function(e){
        length = new Number(maxChars.val().length);
        counter = max_length-length;
        $("#sessionNum_counter").text(counter);
    });
}
});

Eingang:

<input name="sessionNum" id="sessionNum" maxlength="5" type="text">
Number of chars: <span id="sessionNum_counter">5</span>

InformationsquelleAutor Sašo Krajnc

3

Machen es einfacher
```
      <input type="text" maxlength="3" />
```
und verwenden Sie eine Warnung um zu zeigen, dass max chars verwendet wurden.

InformationsquelleAutor user5829707
2
```
<input type="text" maxlength="5">
```
die maximale Höhe der Buchstaben, die in der Eingabe 5.

InformationsquelleAutor anonymous
1

Können Sie verwenden
<input type = "text" maxlength="9">
oder

<input type = "number" maxlength="9"> für zahlen
oder
<input type = "email" maxlength="9"> für E-Mail
die Validierung wird zeigen, bis

dies funktioniert nicht für die Anzahl, nur text

InformationsquelleAutor BKas Development
1

Maxlength

Die maximale Anzahl von Zeichen, die akzeptiert als Eingabe.
Das maxlength-Attribut gibt die maximale Anzahl der zulässigen Zeichen in das element.

Maxlength W3 schools
```
  <form action="/action_page.php">
     Username: <input type="text" name="usrname" maxlength="5"><br>
     <input type="submit" value="Submit">
   </form>
```
InformationsquelleAutor Kondal

Schreibe einen Kommentar

Du musst angemeldet sein, um einen Kommentar abzugeben.