2016-09-29 29 views
0

我嘗試通過從文本框中獲取值並計算然後使用innerhtml顯示它來添加兩個數字,但它不工作我在這段代碼中做了什麼錯誤 我在使用java腳本添加兩個數字時發生了什麼錯誤

<body onload="alert('Hey check out my Calculator')"> 
 
<h1 align="center" > functional calulator </h1> 
 
<div class="Calculator" align="center"> 
 
    \t <input type="text" name="text1" id="a1">Enter 1st Number <br><br> 
 
    \t <input type="text" name="text2" id="a2">Enter 2nd Number<br><br> 
 
    \t <button onclick="add()" >Add</button> 
 
    \t <p id="p1"></p> 
 
    \t 
 
\t <script type="text/javascript"> \t 
 
\t \t function add(){ 
 
\t \t \t var a = document.getElementById("a1").value; 
 
\t \t \t var b = document.getElementByID("a2").value; 
 
\t \t \t var total = a + b; 
 
\t \t \t document.getElementById("p1").innerHTML = total; 
 
\t \t \t 
 
\t \t \t 
 

 
\t \t } 
 
\t \t </script>

+0

闡述什麼是 「它不工作」 的意思吧。你有什麼? – j08691

回答

2

要添加它們作爲一個字符串,使他們被連接起來,你應該把它解析到第一

var a = parseInt(document.getElementById("a1").value); 
var b = parseInt(document.getElementById("a2").value); 
var total = a + b; 
document.getElementById("p1").innerHTML = total; 
+0

我建議添加10作爲parseInt的第二個參數,舊的broswers可以解析「010」爲八進制 – Tobia

0

getElementByID應該是getElementById在整數var b = document.getElementById("a2").value;

和做parseInt()您的a和b將它們視爲一個數字。

<body onload="alert('Hey check out my Calculator')"> 
 
    <h1 align="center"> functional calulator </h1> 
 
    <div class="Calculator" align="center"> 
 
    <input type="text" name="text1" id="a1">Enter 1st Number 
 
    <br> 
 
    <br> 
 
    <input type="text" name="text2" id="a2">Enter 2nd Number 
 
    <br> 
 
    <br> 
 
    <button onclick="add()">Add</button> 
 
    <p id="p1"></p> 
 

 
    <script type="text/javascript"> 
 
     function add() { 
 
     var a = document.getElementById("a1").value; 
 
     var b = document.getElementById("a2").value; 
 
     var total = parseInt(a) + parseInt(b); 
 
     document.getElementById("p1").innerHTML = total; 
 
     } 
 
    </script>

1

a,b爲字符串。也許你想解析他們的整數?

0

嘗試這個 - 你犯了錯拼 - 它的document.getElementById沒有的document.getElementById

<body onload="alert('Hey check out my Calculator')"> 
 
<h1 align="center" > functional calulator </h1> 
 
<div class="Calculator" align="center"> 
 
    \t <input type="text" name="text1" id="a1">Enter 1st Number <br><br> 
 
    \t <input type="text" name="text2" id="a2">Enter 2nd Number<br><br> 
 
    \t <button onclick="add()" >Add</button> 
 
    \t <p id="p1"></p> 
 
    \t 
 
\t <script type="text/javascript"> \t 
 
\t \t function add(){ 
 
      var a = document.getElementById("a1").value; 
 
\t \t \t var b = document.getElementById("a2").value; 
 
      
 
\t \t \t var total = parseInt(a) + parseInt(b); 
 
\t \t \t document.getElementById("p1").innerHTML = total; 
 
\t \t \t 
 
\t \t \t 
 

 
\t \t } 
 
\t \t </script>

相關問題