DDurchmesser berechnen in Javascript?

4 Antworten

Abgesehen von dem falschen Leerzeichen zwischen „get“ und „ElementById“ funktioniert die Funktion. Wobei soll wirklich document.write benutzt werden? Je nachdem wann es ausgeführt wird wird der Rest der Seite überschrieben.
Sinnvoller könnte es sein das ganze in z.B. eine span zu schreiben.

Falls es bei dir nicht funktioniert wäre das ganze HTML nötig um den Fehler zu finden.

Du hast ein Leerzeichen zwischen get und Element:

var r = document.get ElementById("radius").value;

da darf aber kein Leerzeichen sein:

var r = document.getElementById("radius").value;

LG

Das mit dem Leerzeichen ist ja inzwischen geklärt.

aller dings habe ich mich an dem document.write() gestoßen.

Das nenne ich die Selbstmordfunktion für jedes HTML. Nach dem Aufruf gibt es weder HTML noch Javascript, welches ausgeführt werden könnte. Jede eventuell danach aufgerufene Funktion würde niemals ausgeführt werden.

Dabei ist es Doch so einfach einem Tag mit einer definierten Id das Ergebnis zuzuweisen...

<!DOCTYPE html>
<html>
<body>

<h1>Kreisberechnung</h1>

<label>Radius :</label>
<input type="number" id="radius" name="quantity" value ="1" autofocus>
<button id="calc" onclick="calc()">Berechne</button>

<div id="Result"></div>

<script>

var RadiusInput = document.getElementById("radius");

  //nach dem Start einfach automatisch das Ergebnisfeld mit der Anfangsvalue berechnen
  //wäre ja sinnlose Schreibarbeit
document.getElementById("calc").click();

  //lass das Inputfeld auch auf [enter] reagiernen
RadiusInput.addEventListener("keyup", function(event) { if (event.keyCode === 13) { event.preventDefault(); document.getElementById("calc").click();}});
  
function calc() {
      //berechnen
    Radius = RadiusInput.value;
    Diameter = Radius * 2;
    Circumference = Diameter * Math.PI;
    CircularArea = Math.pow(RadiusInput.value,2) * Math.PI;

      //in Div mit der Id Result schreiben
    document.getElementById("Result").innerHTML =   'Durchmesser = ' + Diameter + '<br>';
    document.getElementById("Result").innerHTML +=  'Umfang      = ' + Circumference + '<br>';
    document.getElementById("Result").innerHTML +=  'Fläche      = ' + CircularArea  + '<br>';
}

</script>
</body>
</html>

...nebenbei habe ich das Inputfeld noch mit etwas Ffunktionalität "beseelt".

Es hat mich schon imer gestört, wenn man nach der eingabe einer Zahl erst nach der Maus greifen muss.

Dieses InputFeld erkennt die Eingabe von Enter!

Als erstes ist da ein Leerzeichen zuviel nach document.get

es muss heißen document.getElementById("radius").value

Kannst Du das mal komplett irgendwo hinpacken? In ein JSfiddle oder so?