TextArea wird als Textfeld bezeichnet, auch als Textbereich bezeichnet. Dies ist eine Mehrzeilungs-Texteingabedeuerung mit Bildlaufleisten, die häufig in Webseiten-Einreichungsformularen verwendet wird. Im Gegensatz zu einem einzeiligen Textfeld für Textkästchen kann die Anzahl der Wörter nicht durch die MaxLength-Eigenschaft einschränken, und für diesen Zweck müssen andere Methoden beschränkt werden, um die voreingestellten Anforderungen zu erfüllen.
Die übliche Praxis besteht darin, #Script Language zu verwenden, um Word -Eingabebestimmungen in Textbereiche -Textfeldern zu implementieren, was einfach und praktisch ist. Angenommen, wir haben einen Textbereichstextbereich mit ID TXTA1. Wir können die Anzahl der auf der Tastatur eingegebenen Wörter auf 10 Zeichen (chinesische Zeichen oder andere kleine Eckzeichen) beschränken:
<script Language = "#" type = "text/ecmascript"> window.onload = function () {document. }} </script>Sein Prinzip besteht darin, den Textbereich der angegebenen ID -Nummer durch Überwachung des Schlüsseldown -Ereignisses zu überwachen. Es kann vorgestellt werden, dass es nur den Tastatureingang begrenzen kann. Wenn der Benutzer den Text in der Zwischenablage durch Klicken auf die Maus festlegt, kann er die Anzahl der Wörter nicht steuern.
Durch die Tastatureingabe können nur 10 Wörter in den obigen Textbereich eingegeben werden. Unser Ziel wurde jedoch nicht erreicht! Bitte kopieren Sie ein paar Text beiläufig und versuchen Sie, ihn mit der richtigen Maustaste einzufügen, um zu sehen, was los ist.
Sie können andere JS -Skripte wie die oben genannten im Internet finden. Egal wie gut sie sind, ihre Prinzipien sind gleich. Durch die Überwachung der Eingabe des Textbereichs durch Betrieb von Tastatur-Tasten wie Keydown, KeyUp oder TastePress kann das Klicken nicht verhindern. Wenn wir die Anzahl der Wörter in textarea wirklich einschränken müssen, müssen wir der Webseite eine weitere Sperre hinzufügen - deaktivieren Sie den Rechtsklick, was zweifellos zusätzlichen Overhead erfordert, und es ist möglicherweise auch etwas, was Webseitenhersteller möglicherweise nicht bereit sind. Tatsächlich gibt es eine einfachere Möglichkeit, die Eigenschaft Onpropertychange zu nutzen.
On -Propertychange kann verwendet werden, um den Wert eines vorgegebenen Elements zu beurteilen. Wenn sich der Wert des Elements ändert, wird das Urteilsereignis ausgelöst. Es kümmert sich nur um den Wert des überwachten Elements und vermeidet die Quelle der Eingabe, damit wir den Zweck erreichen können, die Anzahl der Wörter relativ ideal zu begrenzen. Es gehört zur JS -Kategorie und kann in verschachtelten Vertretern der Formbox -Gebiet verwendet werden. Im Folgenden sind die Code- und Effektstile aufgeführt. Sie können die Eingabe wie die oben genannten testen. Sie werden feststellen, dass es seinen Zweck wirklich erreicht: Egal in welcher Methode Sie eingeben, es kann nur 100 Zeichen (chinesische Zeichen oder andere kleine Lösungssymbole) eingeben:
Code:
<textarea onPropertychange = "if (value.Length> 100) value = value.substr (0,100)" cols = "60" name = "txta" rows = "8"> </textArea>
Um sicherer zu sein, sollte das Hintergrundskriptprogramm, das Formulardaten verarbeitet, auch die übermittelten Daten erneut überprüfen. Wenn die Anzahl der Wörter die voreingestellte Nummer überschreitet, wird sie entsprechend verarbeitet, um den Zweck zu erreichen, die Anzahl der Wörter wirklich einzuschränken. (über)
Eine andere Methode zur Implementierung von TextArea, um die Anzahl der Eingabwörter zu begrenzen (einschließlich Chinesen, nur 10 können eingegeben werden, und alle ASCII -Codes können eingegeben werden)
<Script> Funktion check () {var regc = /[^ -~]+ /g; var rege = // d+/g; var str = t1.Value; if (regc.test (str)) {t1.Value = t1.value.substr (0,10); } if (rege.test (str)) {t1.value = t1.value.substr (0,20); }} </script> <textArea maxLength = "10" id = "t1" OnKeyUp = "check ();"> </textArea>Es gibt einen anderen Weg:
Funktion textcounter (field, maxlimit) {if (field.value.length> maxlimit) {field.value = field.value.substring (0, maxlimit); } else {document.upbook.remlen.value = maxlimit - field.value.length; }}<textArea name = wörter cols = 19 Zeilen = 5 class = input1 onPropertychange = "textcounter (Upbook.words, 50)"> textarea> Anzahl der verbleibenden Wörter: <Eingabename = remlen type = text id = "remlen" style = "Hintergrundfarbe: #d4d0c8; Border: 0; Color: Red" Value = 50 GRÖSSE = 3 MAXLGAGE = 3 MAXLEGHTE = 3 MAXLEGELN.
Funktion limitTextArea (field) {maxlimit = 200; if (field.value.length> maxlimit) field.value = field.value.substring (0, maxlimit);};<textArea cols = 50 rows = 10 name = "comment" id = "commentarea" Onkeydown = "limitTextArea (this)" OnKeyUp = "limitTextArea (this)" OnKeypress = "limittextarea (this)"> </textArea>
title = "Die Textbereichsbreite muss weniger als 300 Zeichen." Es fordert auf, die maximale Anzahl von Bytes in textarea einzugeben.
Zum Beispiel:
<textArea cols = 50 rows = 10 name = "comment" id = "commentarea" Onkeydown = "limitTextArea (this)" OnKeyUp = "limitTextArea (this)" OnKeypress = "limittextarea (this)"> </textArea>