2016-10-21 9 views
-2

Ich bin neu in Javascript nach dem Lernen Programmierung in Java, so habe ich versucht, ein einfaches Objekt in Javascript in einer HTML - Seite zu definieren, aber der Code zeigt mir nicht die Ergebnisse der Berechnungen (IE nicht Anzeigebereiche, Perimeter oder welches Rechteck größer ist). Es scheint keinen Grammatikfehler zu geben.Javascript Objekt nicht angezeigt

<!DOCTYPE html> 

<script language ="JavaScript"> 

      Rectangle = function(b,h) { 

        this.base = parseInt(b); 
        this.height = parseInt(h); 

        this.area = b*h; 
        this.perimeter = (b+h)*2; 
        this.diagonal = sqrt(b*b+h*h); 

        } 

      </script> 

    </head> 

    <body> 

      <h3>Rectangles!</h3> 
      <b>First rectangle</b><br><br> 
      Base: <input type = "number" id = "base1" value = "0"> 
      Height: <input type = "number" id = "height1" value = "0"> 
      <br><br> 
      <b>Second rectangle</b><br><br> 
      Base: <input type = "number" id = "base2" value = "0"> 
      Altezza: <input type = "number" id = "height2" value = "0"> 

      <br><br><br> 
      <b>Data about first rectangle:</b><br><br> 
      <t>Perimeter is <div id = "p1"> </div> 
      <t>Area is <div id = "a1"> </div> 
      <t>Diagonal is <div id = "d1"> </div> 
      <br><br> 
      <b>Data about second rectangle:</b><br><br> 
      <t>Perimeter is <div id = "p2"> </div> 
      <t>Area is <div id = "a2"> </div> 
      <t>Diagonal is <div id = "d2"> </div> 
      <br><br> 
      <div id = "compare"> </div> 

      <script language = "JavaScript"> 
        A = new Rectangle(document.getElementById("base1").value,document.geteElementById("altezza1")); 
        B = new Rectangle(document.getElementById("base2").value,document.geteElementById("altezza2")); 
        document.getElementById("p1").innerHTML = A.perimeter; 
        document.getElementById("a1").innerHTML = A.area; 
        document.getElementById("d1").innerHTML = A.diagonal; 
        document.getElementById("p2").innerHTML = B.perimeter; 
        document.getElementById("a2").innerHTML = B.area; 
        document.getElementById("d2").innerHTML = B.diagonal; 
        if A.area > B.area document.getElementById("compare").innerHTML = "First rectangle is bigger"; 
        if A.area < B.area document.getElementById("compare").innerHTML = "Second rectangle is bigger"; 
        else    document.getElementById("compare").innerHTML = "Rectangles are equal"; 
        </script> 

     </body> 

</html> 
+1

Es gibt mehrere Syntaxfehler in Ihrem Code. Überprüfen Sie die Konsole besser auf Fehler. Die if/else-Konstrukte sind falsch, auch 'geteElementById', was' getElementById' genannt wird. – Tyr

+2

Sie scheinen kein Element mit den IDs von 'altezza1' und 2 –

+0

zu haben. Es fehlen die runden Klammern um die if-Bedingungen. Sie haben definitiv Syntaxfehler in Ihrer Konsole –

Antwort

0

Vor allem Änderung

this.diagonal = sqrt(b*b+h*h); 

zu

this.diagonal = Math.sqrt(b*b+h*h); 

Zweitens

geteElementById 

zu (zu viel "e")

getElementById 

Und ifs sind falsch. Statt

if A.area > B.area document.getElementById("compare").innerHTML = "First rectangle is bigger"; 
        if A.area < B.area document.getElementById("compare").innerHTML = "Second rectangle is bigger"; 
        else    document.getElementById("compare").innerHTML = "Rectangles are equal"; 

etwas schreiben wie diese

document.getElementById("compare").innerHTML = (A.area > B.area) ? "First rectangle is bigger" : ((A.area < B.area) ? "Second rectangle is bigger" : "Rectangles are equal") 

auch - führen Sie Skript nur ein, noch bevor Felder ausgefüllt sind. Tun Sie es bei Klick/Senden/Wert ändern.

Und wie oben erwähnt - Browser Debugging-Tools verwenden. Die Registerkarte "Konsole" in diesen Tools zeigt Ihnen alles, was Sie über Ihre Fehler wissen müssen.

0

Es gibt viele Tippfehler und falsche Syntax in Ihrem Code war, versuchen Sie dies:

function Rectangle(b,h) { 

        this.base = parseInt(b); 
        this.height = parseInt(h); 

        this.area = b*h; 
        this.perimeter = (b+h)*2; 
        this.diagonal = Math.sqrt(b*b+h*h); 
console.log(this.perimeter); 
        } 

      console.log(document.getElementById("base1").value); 

var A = new Rectangle(document.getElementById("base1").value,document.getElementById("height1").value); 
var B = new Rectangle(document.getElementById("base2").value,document.getElementById("height2").value);   document.getElementById("p1").innerHTML = A.perimeter; 
     document.getElementById("a1").innerHTML = A.area; 
        document.getElementById("d1").innerHTML = A.diagonal; 
        document.getElementById("p2").innerHTML = B.perimeter; 
        document.getElementById("a2").innerHTML = B.area; 
        document.getElementById("d2").innerHTML = B.diagonal;   
if (A.area > B.area) document.getElementById("compare").innerHTML = "First rectangle is bigger"; 
if (A.area < B.area) document.getElementById("compare").innerHTML = "Second rectangle is bigger"; 
    else    document.getElementById("compare").innerHTML = "Rectangles are equal";     
+0

Funktioniert immer noch nicht. Und ich schwöre, ich habe die Konsole überprüft, ich muss einige Fehler beim Übersetzen ins Englische gemacht haben, weil ich es in einer anderen Sprache geschrieben habe – Roc

+0

(es gibt NaN als Ergebnis) – Roc

+0

NaN -> Keine Nummer, so dass Sie auf Ihre Eingabe überprüfen können Sie übergeben an die Funktion Rectangel, var A = new Rectangle (document.getElementById ("base1"). value, document.getElementById ("height1"). value); var B = neues Rechteck (document.getElementById ("base2"). Value, document.getElementById ("height2"). Value); . Bitte überprüfen Sie, ob Sie korrekte Werte angeben – Pranay