我的JavaScript不能在我的HTML代碼上工作

-4

我試圖讓按揭計算器。但我不知道是什麼問題，所以它不起作用。你們能注意到我有什麼問題嗎？我的JavaScript不能在我的HTML代碼上工作

這裏是我的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>

代碼，這裏是我的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);

感謝HEL ping :)

來源

2017-01-26 Momo

它打破了什麼地方？你有什麼嘗試？ – Ju66ernaut

在DOM甚至開始加載 –

「它不起作用」之前，你的javascript正在加載並試圖找到'document.getElementById（「button」）' - 這很明顯，因爲你不會問這個問題是否有效。調試101：檢查瀏覽器開發人員工具控制檯是否存在錯誤 –

檢查開發者控制檯是否有錯誤... var 1R，變量名稱不能以數字開頭。

來源

2017-01-26 22:44:43 Gabriel

我跑你的代碼和行11，1R似乎導致一些問題。變量名稱不應以數字開頭。（也有1R，後來1R，所以我認爲你需要首先清除變量名）。然後，像其他人一樣評論，JavaScript文件首先被加載，並且正在尋找尚未加載的按鈕。所以你需要把下面的東西放在你的js文件中。

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

來源

2017-01-26 22:45:47

我的JavaScript不能在我的HTML代碼上工作

回答

相關問題