JavaScript計算器不能正常工作

-3

嗨，所以我是新來的JavaScript和我想做一個簡單的計算器使用HTML和JS。然而，我遇到了一個問題，我按下按鈕來計算答案，它不會做任何事情。我在網上的ide上試了一下，它給了我一個錯誤的答案。這裏是任何人都可以幫助的代碼。謝謝 -JavaScript計算器不能正常工作

<!DOCTYPE html> 
<html> 
<head> 
    <title>calculator</title> 
    <script type="text/javascript"> 
    document.getElementById("equals").onclick = function() { 
     var answer = parseInt(document.getElementById('number_1').value)+ parseInt(document.getElementById('number_1').value); 
     document.getElementById('answer').innerHTML = answer; 
    }; 
    </script> 
</head> 
<body> 
      <input type="text" name="number_1" id = "number_1"> 
      <p>+</p> 
      <input type="text" name="number_2" id = "number_2"> 
      <input type="submit" name="equals" id = "equals" value="="> 
      <p id = "answer"></p> 
</body> 
</html>

來源

2016-09-24 charlie2104

什麼是您的控制檯說？ – baranskistad

調試自己的代碼也編程 –

無法設置爲null – charlie2104

您正在從同一個輸入兩次添加值，並且必須在創建按鈕後設置事件處理程序。

<body> 
    <input type="text" name="number_1" id = "number_1"> 
    <p>+</p> 
    <input type="text" name="number_2" id = "number_2"> 
    <input type="submit" name="equals" id = "equals" value="="> 
    <p id = "answer"></p> 
    <script type="text/javascript"> 
    document.getElementById("equals").onclick = function() { 
     var answer = parseInt(document.getElementById('number_1').value)+ parseInt(document.getElementById('number_1').value); 
     document.getElementById('answer').innerHTML = answer; 
    }; 
    </script> 
</body>

來源

2016-09-24 12:30:33 Musa

好，謝謝財產的「onClick」，但仍然沒有解決，當我按下按鈕，什麼都不會發生的事實的一部分 – charlie2104

形式包括但GET/POST方法的onClick的條件下，一般使用button。

<input type="button" name="equals" id="equals" value="=">

我想你是兩次添加相同的變量？

var answer = parseInt(document.getElementById('number_1').value)+ parseInt(document.getElementById('number_2').value);

來源

2016-09-24 12:34:34 Vikrant

主要問題是您將事件點擊添加到元素等於，但在這些時候元素等於不存在。

包裝你的document.getElementById成在window.onload函數說的javascript：「當所有的文件完成加載，活動點擊的元素相加等於」

試試這個：

window.onload = function() { 
     document.getElementById("equals").onclick = function() { 
      var answer = parseInt(document.getElementById('number_1').value, 10)+ parseInt(document.getElementById('number_2').value, 10); 
      document.getElementById('answer').innerHTML = answer; 
     }; 
    }

另一個重要的是，我已經添加了10個到你的parseint，這是爲了確保轉換成一個數字到十進制模式

「parseInt（）函數解析一個字符串並返回一個整數

radix參數用於指定要使用的數字系統，例如，基數16（十六進制）表示字符串中的數字應從十六進制數字解析爲十進制數字。

如果省略radix參數，JavaScript的假定：

如果字符串以「0x」開始，基數是16（十六進制）如果字符串以「0」開始，基數是8 （八進制）。此功能已被棄用如果字符串以其他任何值開頭，基數是10（十進制）」

來源：parseInt use

來源

2016-09-24 12:38:30

我固定的，現在我不得不纏上了我的代碼在的window.onload

<!DOCTYPE html> 
<html> 
<head> 
    <title>calculator</title> 
    <script type="text/javascript"> 
    window.onload = function(){ 
     document.getElementById("equals").onclick = function() { 
      var answer = parseInt(document.getElementById('number_1').value)+ parseInt(document.getElementById('number_2').value); 
      document.getElementById('answer').innerHTML = answer; 
     }; 
    }; 
    </script> 
</head> 
<body> 
      <input type="text" name="number_1" id = "number_1"> 
      <p>+</p> 
      <input type="text" name="number_2" id = "number_2"> 
      <button id = "equals">=</button> 
      <p id = "answer"></p> 
</body> 
</html>

來源

2016-09-24 12:38:57 charlie2104

JavaScript計算器不能正常工作

回答

相關問題