Monday, September 7, 2015

Addition of Four Numbers in JavaScript

In this article I would like to share with you a simple program that I wrote while learning how to program in Javascript I called this program addition of four numbers it uses html form to accept and compute the total sum of four numbers. I also included a clear button to clear the text box in order for the user to input new series of values.

If you have some questions about programming, about my work please send me an email at jakerpomperada@gmail.com and jakerpomperada@yahoo.com. People here in the Philippines can contact me at  my mobile number 09173084360.

Thank you very much and Happy Programming.


Sample Program Output


Program Listing

<html> 
<head> </head> 
<script type="text/javascript">
function addition_four() { 
var first = document.getElementById("textbox1").value;
var second = document.getElementById("textbox2").value; 
var third = document.getElementById("textbox3").value;
var fourth = document.getElementById("textbox4").value;
var answer =parseInt(first)+parseInt(second) 
            +parseInt(third)+parseInt(fourth);
var textbox5 = document.getElementById('textbox5');
textbox5.value=answer;
 } 

 function clear_box() {
 document.getElementById("textbox1").value="";  
 document.getElementById("textbox2").value="";  
 document.getElementById("textbox3").value="";  
 document.getElementById("textbox4").value="";  
 document.getElementById("textbox1").focus();
 }
</script>
 <body>
 <font face="arial" color="blue">
 <h3> Addition of Four Numbers</h3>
 <input type="text" name="textbox1" id="textbox1" size="3"   /> 
+ <input type="text" name="textbox2" id="textbox2" size="3" /> 
 + <input type="text" name="textbox3" id="textbox3" size="3"  /> 
  + <input type="text" name="textbox4" id="textbox4" size="3"  /> 
<input type="submit" name="button" id="button1" onclick="addition_four()"
value=" = " title="Click here to find the sum of four values" />
<br/><br>
Your answer is
<input type="text" name="textbox5" id="textbox5"  size="10" readonly="true"/>
<br><br>
<input type="submit" name="button" id="button1" onclick="clear_box()" 
value="Clear" title="Click here to clear text fields."/>
</body></font>
 </html>



No comments:

Post a Comment