Formularfelder dynamisch maxlengt setzen und verbeleibende Zeichen anzeigen.

[razzio]

Hallo,
wahrscheinlich schon tausend Mal gefragt und beantwortet aber hier doch wieder ein wenig anders und für mich alleine nicht lösbar...

Voraussetzungen:
Ich bekomme von einem CMS ein Formular geliefert in dem 3 Felder zu finden sind. Zwei Input Type Text und eine Textarea. Alle drei Eingabefelder haben unterschiedliche Klassen (oder auch IDs, das kann ich beides vergeben), und es sollen je nach Klasse unterschiedliche Maxlength-Werte per Javascript vergeben werden. Zusätzlich soll bei allen dreien die restliche Anzahl Zeichen angezeigt werden.

Ich habe die Zeichenbegrenzung und die Anzeige hier mal für eine Textarea hin bekommen: https://jsfiddle.net/k1245se0/ aber dann verließen sie ihn. Wie kann ich das Script ein mal schreiben und mit unterschiedlichen DOM-Elementen arbeiten lassen?

Hintergrund ist folgender: Ich kann im CMS nur unterschiedliche Klassen vergeben aber weder maxlength noch irgend etwas anderes definieren. Und selbstverständlich sollen nicht bei allen anderen Formularen auf der Webseite die Zeichen begrenzt werden oder bzw. die verbleibenden Zeichen angezeigt werden.

Herzliche Grüße, Razzio

 

[kkapsner]

oder auch IDs, das kann ich beides vergeben

IDs sind besser, da sie eindeutig sind.

Wie kann ich das Script ein mal schreiben und mit unterschiedlichen DOM-Elementen arbeiten lassen?

Indem du den Selektor erweiterst: https://jsfiddle.net/k1245se0/3/

Hintergrund ist folgender: Ich kann im CMS nur unterschiedliche Klassen vergeben aber weder maxlength noch irgend etwas anderes definieren. Und selbstverständlich sollen nicht bei allen anderen Formularen auf der Webseite die Zeichen begrenzt werden oder bzw. die verbleibenden Zeichen angezeigt werden.

Dann würde ich es anders machen: du hast ja das Feld, in dem angezeigt wird, wieviele Zeichen noch übrig sind. Suche nach diesem und gehen von diesem dann zu dem dazugehörigen Eingabefeld: https://jsfiddle.net/k1245se0/4/