Zeichen in Textarea zählen und beschränken

14. September 2008 um 23:12 Uhr von Daniel · Trackback-URL

Mit dem folgenden Script kann man live während der Eingabe per JavaScript die Zeichen in einer oder mehreren Textarea-Feldern zählen und darstellen.

Die JavaScript-Funktion sieht folgendermaßen aus :

function textcounter( field, count_field, max_limit )
{
  if( field.value.length > max_limit )
  {
    // Inhalt zu lang -> Inhalt beschneiden
    field.value = field.value.substring(0, max_limit);
  }
  else
  {
    // Laenge des Inhalts korrekt -> "Zeichen verbleibend" aktualisieren
    count_field.value = max_limit - field.value.length;
  }
}

Das HTML muss sich dann an diese Form halten.

<form name="formular" action="javascript:;" method="post">
  <fieldset>
    <strong>Funktion zum z&auml;hlen und beschr&auml;nken von mehreren Textareas auf einer Seite</strong><br/>
    <textarea name="textarea_1" cols="28" rows="5" onkeydown="textcounter(document.formular.textarea_1, document.formular.verbleibende_zeichen_1, 150)" onkeyup="textcounter(document.formular.textarea_1, document.formular.verbleibende_zeichen_1, 150)"></textarea>
    <br/>
    <input type="text" name="verbleibende_zeichen_1" size="3" maxlength="3" value="150" readonly="readonly"/> Zeichen verbleibend<br/>
    <br/>
    <textarea name="textarea_2" cols="28" rows="5" onkeydown="textcounter(document.formular.textarea_2, document.formular.verbleibende_zeichen_2, 150)" onkeyup="textcounter(document.formular.textarea_2, document.formular.verbleibende_zeichen_2, 150)"></textarea>
    <br/>
    <input type="text" name="verbleibende_zeichen_2" size="3" maxlength="3" value="150" readonly="readonly"/> Zeichen verbleibend<br/>
    <br/>
    <input type="submit" name="submit" value="Abschicken"/>
  </fieldset>
</form>

Und so sieht das ganze dann aus: Demo.

4 Kommentare zu "Zeichen in Textarea zählen und beschränken"

: Am 11. Februar 2010 um 06:37 Uhr schrieb c0de
Salü,
wenn man onkeyup verwendet ist es etwas sicherer, denn bei onkey down könnte man z.b. tricksen wenn man einfach über die gesamt-zahl auf der taste bleibt!