✔ Anfänger-Script gibt lediglich "NaN" aus

S

snifz

Grünschnabel
Hallo,

ich hoffe, ich bin hier im richtigen Unterforum gelandet. Mein "Problem" ist wirklich auf unterstem Niveau, bereitet mir allerdings dennoch Schwierigkeiten was das Lösen betrifft. Auch Recherchen im Internet haben mir noch nicht ganz weitergeholfen. Der Grundgedanke ist folgender: ein Eingabe- und Optionsfeld sollen Grundlage für eine Berechnung sein. Je nachdem, ob eben "ja" oder "nein" angegeben wurde, sollen unterschiedliche Werte ausgegeben werden. Möchte ich das Programm durch "button onclick" ausführen, wird mir bei <span> lediglich "NaN ausgegeben:

Javascript: 
<!doctype html>
<html>
    <head>
        <title>Berechnung</title>
        <meta name="author" content="max">
        <script>
            function rechner() {
           
            var a=document.getElementById("zahl");
           
            var g=a*0.5;
            var d=a*0.6;

       
            if (document.getElementById("selectid").value == "val1") {
                document.getElementById("x").innerHTML=g;
            } else {
                document.getElementById("x").innerHTML=d;
            }
       
            }
        </script>
       
    </head>    
    <body>
       
        <p>monatliches Nettogehalt</p>
        <input id="zahl"/>
        <p>Kinder?</p>
       
       
        <select id="selectid" name="selectname">
        <option value="val1" id="valid1"> ja </option>
        <option value="val2" id="valid2"> nein </option>
       
        </select>
       
        <button onclick="rechner()">berechnen</button>
       
        <p>Geld in Höhe von: <span id="x"></span> Euro</p>
       
    </body)
</html>

Denn Sinn hinter diesem Programm bitte nicht hinterfragen. Auch wenn ich mich erst noch weiter mit den Grundlagen beschäftigen muss, würde ich mich freuen, wenn mir jemand weiterhelfen könnte.

In diesem Sinne, vielen Dank im voraus!
 
Code: 
            var a=document.getElementById("zahl");
         
            var g=a*0.5;
            var d=a*0.6;

Nun gut, NaN repräsentiert Not-a-Number Werte. In dem Fall ist dies soger richtig. Warum? Was soll den der Produkt von einem Faktor und einem DOM-Element ergeben? NaN.
Willst du den Wert, der im Input mit der ID "zahl", auslesen und mit einem Faktor multiplizieren, so gebe dies an. :)

Code: 
            var a=document.getElementById("zahl").value;
         
            var g=a*0.5;
            var d=a*0.6;

Da es häufig auch zu Eingabefehlern wie z.B. versehentliche Leerzeichen etc kommen kann, empfehle ich hier noch die Funktion parseFloat zu benutzen:


Code: 
            var a=parseFloat(document.getElementById("zahl").value);
         
            var g=a*0.5;
            var d=a*0.6;
 
Da es häufig auch zu Eingabefehlern wie z.B. versehentliche Leerzeichen etc kommen kann, empfehle ich hier noch die Funktion parseFloat zu benutzen:
Zum Vergrößern anklicken....
... oder ein input-Feld vom Typ number mit geeignetem Step benutzen, dann werden Fehleingaben von vorn herein ausgeschlossen.
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück