Mein Javascript funktioniert nicht auf meinem HTML-Code

-4

Ich habe versucht, Hypothekenrechner zu machen. Aber ich weiß nicht, was das Problem ist, und so funktioniert es nicht. Kannst du mir auffallen, was ist das Problem?Mein Javascript funktioniert nicht auf meinem HTML-Code

hier ist mein Code für html

<!DOCTYPE html> 
 
<html> 
 
<head> 
 
    <meta charset="utf-8" /> 
 
    <meta name="viewport" content="width=device-width,initial-scale=1.0"> 
 
    <title>Mortgage calculator</title> 
 
    
 
    <link rel="stylesheet" href="styles.css" /> 
 
    <script src="assignment1.js"></script> 
 

 
</head> 
 

 
<body> 
 
    <header> 
 
     <h1> 
 
     Mortgage calculator 
 
     </h1> 
 
    </header> 
 

 
    <article> 
 
     <h2><br></h2> 
 
     <form> 
 
     \t \t <fieldset> 
 
     \t \t <label> 
 
     \t \t Mortgage Amount: $ 
 
      \t <input type="number" id="MA" name="MA" required> 
 
\t \t \t </label> 
 

 
     \t \t <label> 
 
     \t \t Down Payment Option: 
 
     \t \t <input name="pickone" type="radio" id="5" onclick="document.getElementById('amor').value = '25';" required>5% 
 
     \t \t <input name="pickone" type="radio" id="10" onclick="document.getElementById('amor').value = '25';" required>10% 
 
     \t \t <input name="pickone" type="radio" id="15" onclick="document.getElementById('amor').value = '25';" required>15% 
 
     \t \t <input name="pickone" type="radio" id="20" onclick="document.getElementById('amor').value = '30';" required>20% 
 
     \t \t </label>  \t 
 
     \t \t \t 
 
     \t \t <label> 
 
     \t \t Down Payment: $ 
 
     \t \t \t <input type="number" id="DP" name="DP" required> 
 
    \t \t \t </label> 
 
    \t \t \t 
 
     \t \t <label> 
 
     \t \t Amortization: 
 
     \t \t \t <input type="text" id="amor" name="amor" required> years 
 
     \t \t </label> 
 
     
 
     \t \t <label> 
 
     \t \t Interest Rate: 
 
     \t \t \t <input type="number" id="IR" name="IR" required>% 
 
     \t \t </label> 
 
     \t 
 
\t \t \t <button type="button" id="button">Calculate</button> 
 

 
\t \t \t <label> 
 
\t \t \t Result: 
 
\t \t \t \t <input type="number" name="Result" id="Result"> 
 
\t \t \t </label> 
 
\t \t \t 
 
\t \t \t </fieldset> 
 
\t \t \t </form> 
 
    </article> \t 
 
</body> 
 
</html>

und hier ist mein assignment1.js

function calculate() { 
 
    \t \t var mortamount = document.getElementById("MA").value; 
 
    \t \t var downpayment = document.getElementById("DP").value; 
 
    \t \t var amortization = document.getElementById("amor").value; 
 
    \t \t var interest = document.getElementById("IR").value; 
 
    \t \t 
 
    \t 
 
    \t \t var p = mortamount - downpayment; 
 
    \t \t var n = amortization * 12; 
 
    \t \t var r = interest/100/12; 
 
    \t \t var 1R = 1 + r; 
 
    \t \t 
 
    \t \t 
 
    \t \t var top = r * p * Math.pow(1r,n); 
 
    \t \t var bot = Math.pow(1r,n) - 1; 
 
    \t \t 
 
    \t \t var mpay = top/bot; 
 
    \t \t 
 
    \t \t document.getElementById("Result").value = mpay; 
 
\t } 
 
\t document.getElementById("button"). 
 
\t addEventListener("click", calculate, false);

Dank für HEL-File ping :)

Quelle

2017-01-26 Momo

Wo bricht es? Was hast du probiert? – Ju66ernaut

Ihr Javascript lädt und versucht, 'document.getElementById (" button ") zu finden, bevor das DOM überhaupt begonnen hat, –

zu laden' das funktioniert nicht' - das ist offensichtlich, weil Sie nicht die Frage stellen würden, ob es funktioniert. Debugging 101: Überprüfen Sie die Browser-Entwickler-Tools-Konsole auf Fehler –

Überprüfen Sie die Entwicklerkonsole auf Fehler ... var 1R, Variablennamen können nicht mit einer Nummer beginnen.

Quelle

2017-01-26 22:44:43 Gabriel

Ich lief Ihren Code und die Zeile 11, 1R scheint wie verursacht ein Problem. Variablennamen sollten nicht mit der Nummer beginnen. (Es hat auch 1R, und später 1r, also denke ich, dass Sie zuerst die Variablennamen löschen müssen.) Dann, wie andere Leute kommentiert, wird die Javascript-Datei zuerst geladen und sucht nach der Schaltfläche, die noch nicht geladen ist. Also müssen Sie etwas wie unten in Ihre js-Datei einfügen.

document.addEventListener('DOMContentLoaded',() => { 
// your code goes here 
}

Quelle

2017-01-26 22:45:47

Mein Javascript funktioniert nicht auf meinem HTML-Code

Antwort

Verwandte Themen