使用html和javascript添加兩個數字

我想添加兩個numbers.Taking來自用戶的輸入，但我無法找到我要去哪裏錯了。每次我點擊提交它只刷新頁面。使用html和javascript添加兩個數字

<!--Html --> 



    <html> 
     <body> 
      <div class="container-fluid"> 
       <header> 
        <h1>Business Registration Address Setup</h1> 
       </header> 

     <form> 
       <label>number 1</label> 
       <input type="text" name="number1" id="number1" placeholder="enter single digit number"> <br> 
       +<br> 
       <label>number 2</label> 
       <input type="text" name="number2" id="number2" placeholder="enter single digit number"><br> 
       <button type="submit" class="btn btn-info" onclick="submit1()">submit</button><br><br> 
       <div class="screen" id="screen1"></div> 

      </form> 

      </div> <!-- End Container--> 



     <footer> 

     </footer> 
      <script type="text/javascript"> 
       function submit1(){ 
       var a = document.getElementByID("number1").value; 
       var b = document.getElementByID("number2").value; 
       var c = a + b; 
      document.getElementByID("screen1").innerHTML=c; 
       } 
      </script> 

     </body> 
     </html>

來源

2016-06-15 Priyanka Maurya

如@Mairaj艾哈邁德提到的，只是改變'類型= '從'型button'' =' submit' – Hearty

錯誤是1型= 「按鍵」 2 。documentgetElementById 3.解析整數。工作網址：http://codepen.io/SESN/pen/xOOGZG – SESN

<!DOCTYPE html> 
<html> 
<body> 

<div class="container-fluid"> 
    <header> 
     <h1>Business Registration Address Setup</h1> 
    </header> 

    <label>number 1</label> 
    <input type="text" name="number1" id="number1" placeholder="enter single digit number"> <br> 
    +<br> 
    <label>number 2</label> 
    <input type="text" name="number2" id="number2" placeholder="enter single digit number"><br> 
    <button type="button" class="btn btn-info" onclick="submit1()">submit</button><br><br> 
    <div class="screen" id="screen1"></div> 


</div> <!-- End Container--> 


<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script> 
<script> 
$(document).ready(function() { 

}); 
function submit1(){ 
    var a = document.getElementById("number1").value; 
    var b = document.getElementById("number2").value; 
    var c = parseInt(a) + parseInt(b); 
    document.getElementById("screen1").innerHTML=c; 
    } 
</script> 

</body> 
</html>

編輯

document.getElementByID -------> document.getElementById 
var c=a+b ----------------------> var c = parseInt(a) + parseInt(b) 
button type="submit" -----------> button type="button"

來源

2016-06-15 07:15:06

您正在使用type="submit"這就是刷新頁面的原因。

單擊button時，您需要使用type="button"來撥打javascript function。

<button type="button" class="btn btn-info" onclick="submit1()">submit</button><br><br>

而且使用的是document.getElementByID這是不是一個功能是document.getElementById。

而且你還需要將值parse到int是added否則值將只是concatenated而不是added。

var c = parseInt(a) + parseInt(b);

來源

2016-06-15 07:04:00 Mairaj

使用html和javascript添加兩個數字

回答

相關問題