JavaScript - Anzahl der Wörter als Fortschrittsbalken anzeigen


<script>

// Anzahl der Wörter als Fortschrittsbalken anzeigen

function words(ID) {
 var 
str event.target.value;
 var 
words str.split(" ");
 
document.getElementById(ID).value words.length;
 
document.getElementById(ID).innerText words.length '%';
}
</
script>

<
label>Fortschrittsbalken: <progress id="output1" value="0" max="100"></progress><br>
<
textarea onInput="words('output1')" cols="35" rows="10"></textarea>
</
label>

Beim HTML-Attribut: max="100" wird die maximale Länge des Fortschrittsbalkens angegeben.
Für jedes weitere Eingabefeld (Textarea) muss eine eigene ID (output1) verwendet werden.

Siehe auch: Zeilen, Wörter und Zeichen in einem Textarea zählen

Bausteine  Alle Anzeigen

Eine zufällige Auswahl von Bausteinen (Codeschnipsel) aus den Bereichen HTML, CSS, PHP, JavaScript und MySQL.

<dialog> Dialog Element

CSS - Container mit Eselsohren

PHP - Datei alle fünf Sekunden aktualisieren

JavaScript - Browser Infos

MySQL - Datensatz Wert erhöhen