Dreisatz antiproportional

So funktioniert das Script

Das Script besteht aus drei Teilen: Es liest die drei Eingabefelder aus, rechnet den umgekehrten Dreisatz und schreibt das Ergebnis in die Ausgabefläche. Alles steckt in einer sofort ausgeführten Funktion, damit keine Variablennamen mit anderen Scripts auf der Seite kollidieren.

function zahl(id) {
  return Number(document.getElementById(id).value.replace(",", "."));
}

Die Hilfsfunktion zahl() holt sich ein Eingabefeld anhand seiner id, liest den eingetippten Text aus und macht daraus mit Number() eine Zahl. Der Trick davor: replace(",", ".") tauscht ein deutsches Dezimalkomma gegen einen Punkt, denn JavaScript versteht intern nur die englische Schreibweise — aus "7,5" wird so erst "7.5" und dann die Zahl 7.5. Weil dieselben drei Zeilen sonst dreimal dastünden, lohnt sich die eigene kleine Funktion.

if (isNaN(anzahlAlt) || !anzahlNeu || isNaN(dauer)) {
  ausgabe.textContent = "Bitte tragt in alle drei Felder eine Zahl ein.";
  return;
}

Bevor gerechnet wird, prüft das Script die Eingaben. isNaN() steht für „is Not a Number" und erkennt, wenn in einem Feld keine gültige Zahl steht. Die neue Anzahl bekommt mit !anzahlNeu eine zusätzliche Prüfung — sie darf nicht 0 sein, weil durch sie geteilt wird und eine Division durch null kein sinnvolles Ergebnis liefert. Im Fehlerfall erscheint ein Hinweis und return beendet die Funktion, ohne weiterzurechnen.

const dauerNeu = (dauer * anzahlAlt) / anzahlNeu;

Das ist der antiproportionale Dreisatz in einer Zeile — und der Unterschied zum geraden Dreisatz steckt allein darin, welche Zahl im Nenner steht. Klassisch rechnet man in zwei Schritten über die Gesamtarbeit: Erst wird ermittelt, wie lange ein einziger Arbeiter bräuchte (dauer * anzahlAlt, also 35 h × 20 = 700 Arbeitsstunden), dann wird diese Summe auf die neue Mannschaft verteilt (700 ÷ 15 = 46,7 h). Die Zwischengröße 700 bleibt konstant — genau das macht die Zuordnung antiproportional.

Zum Vergleich: Beim geraden Dreisatz stünde hier (anzahlNeu * dauer) / anzahlAlt. Alt und Neu tauschen also die Plätze, sonst ändert sich nichts.

ausgabe.innerHTML =
  anzahlNeu + " brauchen <strong>" +
  dauerNeu.toFixed(1).replace(".", ",") + " h</strong>";

toFixed(1) rundet auf eine Nachkommastelle, und das anschließende replace macht aus dem Punkt wieder ein deutsches Komma. Weil das Ergebnis per innerHTML gesetzt wird, darf die Dauer in <strong>-Tags stehen und erscheint hervorgehoben.

document.getElementById("dsa-berechnen").addEventListener("click", rechnen);

Zum Schluss wird die Funktion rechnen() mit dem Knopf verbunden: addEventListener("click", …) sorgt dafür, dass sie bei jedem Klick läuft. Das Script steht dafür unter dem Formular — so existieren Knopf und Felder bereits, wenn es ausgeführt wird.

Zum Anpassen: Wenn ihr statt Stunden mit Tagen oder Minuten rechnet, ändert ihr nur die Beschriftungen im HTML und die Einheit " h" im Ausgabetext — die Formel bleibt dieselbe. Mehr oder weniger Nachkommastellen bekommt ihr über die Zahl in toFixed(1).