Maximale Länge für HTML <textarea>

Question

So beschränken Sie die maximale Anzahl von Zeichen, die in ein HTML eingegeben werden können <textarea>?Ich suche nach einer browserübergreifenden Lösung.

Answer 1

Der TEXTAREA Tag hat kein MAXLENGTH Attribut die Art und Weise, dass einINPUT tag funktioniert, zumindest nicht in den meisten Standardbrowsern.Eine sehr einfache und effektive Möglichkeit, die Anzahl der möglichen Zeichen zu begrenzen getippt in ein TEXTAREA Tag ist:

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

Notiz: onKeyPress, wird jeden Tastendruck verhindern, eine beliebige Taste einschließlich die Rücktaste.

Dies funktioniert, weil der boolesche Ausdruck die Länge des Felds vergleicht bevor das neue Zeichen zur gewünschten maximalen Länge hinzugefügt wird (in diesem Beispiel 50, verwenden Sie hier Ihr eigenes) und true zurückgibt, wenn Platz für ein weiteres Zeichen vorhanden ist, false wenn nicht.Wenn bei den meisten Ereignissen „false“ zurückgegeben wird, wird die Standardaktion abgebrochen.Wenn also die aktuelle Länge bereits 50 (oder mehr) beträgt, gibt der Handler false zurück, das KeyPress Die Aktion wird abgebrochen und das Zeichen wird nicht hinzugefügt.

Ein Wermutstropfen ist die Möglichkeit des Einfügens in eine TEXTAREA, die nicht dazu führt, dass die KeyPress Ereignis auszulösen und so diese Prüfung zu umgehen.Internet Explorer 5+ enthält eine onPaste -Ereignis, dessen Handler die prüfen.Beachten Sie jedoch, dass Sie auch berücksichtigen müssen, wie viele Zeichen warten in der Zwischenablage, um zu wissen, ob die Summe Sie über das Limit bringen oder nicht.Glücklicherweise enthält der IE auch eine Zwischenablage -Objekt aus dem window-Objekt.1 Daher:

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

Wieder die onPaste Veranstaltung und clipboardData Objekt sind nur für IE 5+ verfügbar.Für eine browserübergreifende Lösung müssen Sie lediglich eine verwenden OnChange oder OnBlur Handler, um die Länge zu überprüfen und sie nach Ihren Wünschen zu behandeln (den Wert stillschweigend abschneiden, den Benutzer benachrichtigen usw.).Leider wird der Fehler dadurch nicht erkannt, wenn er auftritt, sondern erst dann, wenn der Benutzer versucht, das Feld zu verlassen, was nicht ganz so benutzerfreundlich ist.

Quelle

Hier gibt es auch eine andere Möglichkeit, einschließlich eines fertigen Skripts, das Sie in Ihre Seite einbinden könnten:

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

Answer 2

HTML5 erlaubt jetzt maxlength Attribut auf <textarea>.

Es wird von allen Browsern außer IE <= 9 und iOS Safari 8.4 unterstützt.Sehen Support-Tabelle auf caniuse.com.

Answer 3

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

Referenz Legen Sie die maximale Länge im HTML-Textbereich fest