Zeichenbegrenzung in HTML

95

Wie können Sie einer Texteingabe in HTML eine Zeichenbeschränkung auferlegen?

Iwasakabukiman
quelle

Antworten:

133

Es gibt 2 Hauptlösungen:

Das reine HTML:

<input type="text" id="Textbox" name="Textbox" maxlength="10" />

Das JavaScript (an ein onKey-Ereignis anhängen):

function limitText(limitField, limitNum) {
    if (limitField.value.length > limitNum) {
        limitField.value = limitField.value.substring(0, limitNum);
    } 
}

Aber es gibt keine gute Lösung. Sie können sich nicht an die schlechte HTML-Implementierung jedes Kunden anpassen, es ist ein unmöglicher Kampf, um zu gewinnen. Deshalb ist es weitaus besser, es auf der Serverseite mit einem PHP / Python / was auch immer-Skript zu überprüfen.

e-satis
quelle
27
Überprüfen Sie den Server als letzte Überprüfung der Integrität, fügen Sie jedoch eine clientseitige Verbesserung hinzu, wenn Sie dies tun können. Dies sorgt für eine reichhaltigere Benutzererfahrung.
Rob
43

Es gibt ein Attribut für die maximale Länge

<input type="text" name="textboxname" maxlength="100" />
Kreuzer
quelle
1
Dies ist wahr, aber einige Clients überprüfen dies nicht. Dies gilt insbesondere für Clients auf Mobiltelefonbasis.
Drejc
Es gibt auch Möglichkeiten, sie zu entfernen. Beispielsweise verfügt die Firefox Web Developer-Erweiterung über die Funktion "Maximale Längen entfernen".
Sam Hasler
Mit Chrome und dem Entwickler-Kit (das mit dem Browser geliefert wird) ist es einfach, solche Dinge im HTML-
Code
12

Darüber hinaus möchte ich darauf hinweisen, dass die clientseitige Validierung (HTML-Code, Javascript usw.) niemals ausreicht. Überprüfen Sie auch die Länge auf der Serverseite oder überprüfen Sie sie überhaupt nicht (wenn es nicht so wichtig ist, dass die Leute sie umgehen können, ist es auch nicht wichtig genug, um wirklich Schritte zu rechtfertigen, um dies zu verhindern).

Außerdem, Leute, sagte er (oder sie) HTML, nicht XHTML. ;)

Devin Jeanpierre
quelle
Genau. Man kann Daten mit einem Skript-Tool direkt auf eine Website POSTEN, so dass in diesem Fall die maximale Länge und andere browser-seitige Validierungen nicht
kinderleicht
oder benutze Firebug und entferne das Attribut maxlength.
Zach
1

Für das <input> -Element gibt es das Attribut maxlength:

<input type="text" id="Textbox" name="Textbox" maxlength="10" />

(Der Typ ist übrigens "Text", nicht "Textfeld", wie andere schreiben). Sie müssen jedoch Javascript mit <Textbereich> verwenden. In jedem Fall sollte die Länge auf dem Server trotzdem überprüft werden.

pilsetnieks
quelle
0

Sie können die maximale Länge mit jquery einstellen, was sehr schnell ist

jQuery(document).ready(function($){ //fire on DOM ready
 setformfieldsize(jQuery('#comment'), 50, 'charsremain')
})
shekh danishuesn
quelle