Berechnung von Inhalte

donMiki

Grünschnabel
Bei mir hat sich irgend wo ein Hund Versteckt??

Den kann ich leider nicht finden.
Kann mir bitte jemand helfen?

http://jsfiddle.net/donMiki/duzeb7hq/1/

Code:
<span>Liquid:</span>

<input type="text" name="liquid" id="liquid" />
<br /> <span>Aroma 1:</span>

<input type="text" name="aroma1" id="aroma1" />in %
<input type="text" name="aroma1ges" id="aroma1ges" disabled="disabled" />in ml
<br> <span>Aroma 2:</span>

<input type="text" name="aroma2" id="aroma2" />in %
<input type="text" name="aroma2ges" id="aroma2ges" disabled="disabled" />in ml
<br> <span>Aroma 3:</span>

<input type="text" name="aroma1" id="aroma1" />in %
<input type="text" name="aroma3ges" id="aroma3ges" disabled="disabled" />in ml
<br> <span>Aroma 4:</span>

<input type="text" name="aroma4" id="aroma4" />in %
<input type="text" name="aroma4ges" id="aroma4ges" disabled="disabled" />in ml
<br>
<br />
<span>Aroma Gesamt:</span>

<input type="text" name="ges" id="ges" disabled="disabled" />
<br />
<span>Base:</span>

<input type="text" name="base" id="base" disabled="disabled" />
<br />
<input type="button" name="berechnen" value="Berechnen" onclick="berechnung()" />

Code:
function berechnung() {
  total = parseFloat(document.getElementById("liquid").value * 1);
  w1 = parseFloat(document.getElementById("aroma1").value * 1);
  w2 = parseFloat(document.getElementById("aroma2").value * 1);
  w3 = parseFloat(document.getElementById("aroma3").value * 1);
  w4 = parseFloat(document.getElementById("aroma4").value * 1);
  ges = (w1 + w2 + w3 + w4);

  t1 = (liquid / 100) * w1;
  t2 = (liquid / 100) * w2;
  t3 = (liquid / 100) * w3;
  t4 = (liquid / 100) * w4;
  document.getElementById("aroma1ges").innerHTML = t1.toFixed(2);
  document.getElementById("aroma2ges").innerHTML = t2.toFixed(2);
  document.getElementById("aroma3ges").innerHTML = t3.toFixed(2);
  document.getElementById("aroma4ges").innerHTML = t4.toFixed(2);
  document.getElementById("aromages").innerHTML = (w1 + w2 + w3 + w4).toFixed(2);
 
Hi,

da hat sich nicht nur ein Hund, sondern ein ganzes Rudel versteckt.

Du greifst auf eine Variable (liquid) zu, die eigentlich total heissen müsste.
Du versuchst input-Felder über innerHTML zu füllen - richtig wäre die Eigenschaft value.
Du definierst alle Variablen innerhalb der Funktion als global.
Du hast im HTML-Code vergessen, die IDs richtig zu setzen (aroma1 statt aroma3, aromages statt ges).

Hier der korrigierte JavaScript-Teil:
Javascript:
function berechnung() {
    var total = parseFloat(document.getElementById("liquid").value * 1),
        w1 = parseFloat(document.getElementById("aroma1").value * 1),
        w2 = parseFloat(document.getElementById("aroma2").value * 1),
        w3 = parseFloat(document.getElementById("aroma3").value * 1),
        w4 = parseFloat(document.getElementById("aroma4").value * 1),
        ges = (w1 + w2 + w3 + w4),
        t1 = (total / 100) * w1,
        t2 = (total / 100) * w2,
        t3 = (total / 100) * w3,
        t4 = (total / 100) * w4;

    document.getElementById("aroma1ges").value = t1.toFixed(2);
    document.getElementById("aroma2ges").value = t2.toFixed(2);
    document.getElementById("aroma3ges").value = t3.toFixed(2);
    document.getElementById("aroma4ges").value = t4.toFixed(2);
    document.getElementById("ges").value = (w1 + w2 + w3 + w4).toFixed(2);
}

Das HTML-Dokument kannst du alleine fixen.

Ciao
Quaese
 
Zurück