Maximale Länge für HTML <textarea>

Question

Wie die maximale Anzahl von Zeichen, die in ein HTML <textarea> eingegeben werden können? Ich suche nach einer Cross-Browser-Lösung.

Answer 1

Die TEXTAREA-Tag nicht über ein MAXLENGTH den Weg Attribut, das ein INPUT Tag tut, zumindest nicht in den meisten Standard-Browsern. Eine sehr einfache und effektive Möglichkeit, die Anzahl der Zeichen zu begrenzen, die sein kann in ein TEXTAREA-Tag eingegeben ist:

<textarea onKeyPress="return (this.value.length < 50);"></textarea> 

Hinweis:onKeyPress, wird eine beliebige Taste drücken, um zu verhindern, eine beliebige Tasteeinschließlich der Rücktaste.

Dies funktioniert, weil der boolesche Ausdruck die Feldlänge vergleicht, bevor das neue Zeichen zu der maximalen Länge hinzugefügt wird false wenn nicht. Wenn von den meisten Ereignissen false zurückgegeben wird, wird die Standardaktion abgebrochen. Wenn also die aktuelle Länge bereits 50 (oder mehr) ist, gibt der Handler den Wert false zurück, die Aktion KeyPress wird abgebrochen und das Zeichen wird nicht hinzugefügt.

Ein Haar in der Suppe ist die Möglichkeit, das Einfügen in eine TEXTAREA, die nicht KeyPress Ereignis verursacht diese Prüfung zu schießen, zu umgehen. Internet Explorer 5+ enthält ein onPaste Ereignis, dessen Handler die Prüfung enthalten kann. Beachten Sie jedoch, dass Sie auch berücksichtigen müssen, wie viele Zeichen in der Zwischenablage warten, um zu wissen, ob die Summe über das Limit hinaus geht oder nicht. Glücklicherweise enthält IE auch eine Zwischenablage Objekt aus dem Fensterobjekt. 1 So:

<textarea onKeyPress="return (this.value.length < 50);" 
onPaste="return ((this.value.length + 
window.clipboardData.getData('Text').length) < 50);"></textarea> 

Auch das onPaste Ereignis und clipboardData Objekt ist IE 5+ nur. Für eine browserübergreifende Lösung müssen Sie nur einen OnChange oder -Handler verwenden, um die Länge zu prüfen und beliebig zu verarbeiten (den Wert stillschweigend abschneiden, den Benutzer benachrichtigen usw.). Leider fängt dies den Fehler nicht so ein, wie es gerade passiert, nur wenn der Benutzer versucht, das Feld zu verlassen, was nicht ganz so freundlich ist.

Source

Außerdem gibt es eine weitere Möglichkeit, hier ein fertiges Skript auch Sie in Ihrer Seite umfassen könnten:

http://cf-bill.blogspot.com/2005/05/textarea-maxlength-revisited.html

Answer 2

HTML5 ermöglicht jetzt maxlength attribute on <textarea>.

Es wird von allen Browsern außer IE < = 9 und iOS Safari 8.4 unterstützt. Siehe support table on caniuse.com.

Answer 3

$(function(){ 
    $("#id").keypress(function() { 
    var maxlen = 100; 
if ($(this).val().length > maxlen) { 
    return false; 
} 
}) 
}); 

Referenz Set maxlength in Html Textarea