Jump to content

Basic Calculator in JavaSript


Tina
 Share

Recommended Posts

ngubantbI'm new learner in JavaScript. Please assist. I would like to create a basic calculator, using , form, input, tables and to be able to create my own funtion for add, multipy and so on.If you can please give me the explaination of each line on your code.I feel this will help me understand mor about function.Thank you

  • Like 1
Link to comment
Share on other sites

So You want whole code!!!Sorry boss, But  I think you should click on following link for basic understanding http://www.w3schools.com/js/default.asp

Or just do a Google search for JavaScript Calculator or something....do I bit of research before asking for whole scripts...better yet try coding it your self first.
Link to comment
Share on other sites

Or just do a Google search for JavaScript Calculator or something....do I bit of research before asking for whole scripts...better yet try coding it your self first.

Thank you for your advice guys, I did a research and more studying.My calulator is now working , but I want to put a button to round of the number, at the moment , it automaticaly round of when you click equal oparator. na i want to be able to close the window by clicking on a close button I have put on a calculator, here is the code:
<html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /><title>Untitled Document</title><script language="JavaScript">var sum1=0;var RememberThisNumber = 0;var value1=0;var value2=0;function Add1(Calc){  RememberThisNumber = 1;  value1 = Calc.Input.value;  Calc.Input.value = "";  return true;}function Subtract1(Calc){   RememberThisNumber = 2;   value1 = Calc.Input.value;   Calc.Input.value = "";      return true}function Multiple1(){   RememberThisNumber = 3;   value1 = Calc.Input.value;   Calc.Input.value = "";      return true}function Division1(){  RememberThisNumber = 4;  value1 = Calc.Input.value;  Calc.Input.value = "";  return true}function Equal1(Calc){  if ( RememberThisNumber == 1 )  {    sum1 = eval(value1) + eval(Calc.Input.value); 	   }  if ( RememberThisNumber == 2 )  {    sum1 = eval(value1) - eval(Calc.Input.value);     }  if ( RememberThisNumber == 3 )  {    sum1 = eval(value1) * eval(Calc.Input.value);     }  if ( RememberThisNumber == 4 )  {      sum1 = Math.round(eval(value1) / eval(Calc.Input.value),2);     }     Calc.Input.value = sum1;    return true;}function roundoff(){  var sum2 = Math.round(Calc.Input.value,2);  Calc.Input.value = sum2;  }function clearthis(Calc){	Calc.Input.value="";}function CloseWindow(Calc){   window.closed    return true;  }    </script></head><body onload="clearthis(Calc)"><CENTER><FORM NAME="Calc" ><TABLE BORDER=4 bgcolor="#999999"" ><TR><TD><INPUT   NAME="Input" TYPE="text" value="0" SIZE="16" ><BR></TD></TR><TR><TD><INPUT TYPE="button" NAME="one"   VALUE="  1  " onClick="Calc.Input.value += '1'"><INPUT TYPE="button" NAME="two"   VALUE="  2  " onClick="Calc.Input.value += '2'"><INPUT TYPE="button" NAME="three" VALUE="  3  " onClick="Calc.Input.value += '3'"><INPUT TYPE="button" NAME="plus"  VALUE="  +  " onClick="Add1(Calc)"></TD></TR><p><TR><TD><INPUT TYPE="button" NAME="four"  VALUE="  4  " onClick="Calc.Input.value += '4'"><INPUT TYPE="button" NAME="five"  VALUE="  5  " onClick="Calc.Input.value += '5'"><INPUT TYPE="button" NAME="six"   VALUE="  6  " onClick="Calc.Input.value += '6'"><INPUT TYPE="button" NAME="minus" VALUE="  -  " onClick="Subtract1(Calc)"></TD></TR><p><TR><TD><INPUT TYPE="button" NAME="seven" VALUE="  7  " onClick="Calc.Input.value += '7'"><INPUT TYPE="button" NAME="eight" VALUE="  8  " onClick="Calc.Input.value += '8'"><INPUT TYPE="button" NAME="nine"  VALUE="  9  " onClick="Calc.Input.value += '9'"><INPUT TYPE="button" NAME="multiply" VALUE="  x  " onClick="Multiple1(Calc)"></TD></TR><p><TR><TD><INPUT TYPE="button" NAME="Clear" VALUE="  C  " onClick="Calc.Input.value = ''"><INPUT TYPE="button" NAME="zero"  VALUE="  0  " onClick="Calc.Input.value += '0'"><INPUT TYPE="button" NAME="Result"  VALUE="  =  " onClick="Equal1(Calc)"><INPUT TYPE="button" NAME="division"   VALUE="  /  " onClick="Division1(Calc)"></TD></TR><TR><TD ALIGN="center" VALIGN="middle" ><INPUT TYPE="button"   NAME="closethis" value="Close" onclick="CloseWindow" ><INPUT TYPE="button"   NAME="roundoff" value="  R  " onclick="Math.round(Calc.Input.value)" > <INPUT TYPE="button" NAME="six"   VALUE="  .   " onClick="Calc.Input.value += '.'"></TD></TR></FORM>

Link to comment
Share on other sites

Here's a calculator I made, if you'd like to look through it. I made it a couple months ago. It was on page 14 of the javascript forum. :)

<head><title>Calculator</title><style type="text/css"><!--form {width: 150px;border: outset 3px #000000;}input {width: 30px;background-color: #dedede;color: #000000;border: double #0000ff 3px;}input:active {background-color: #ff0000;}input.window {width: 132px;background-color: #ffffff;color: #000000;}input.sum {width: 132px;}--></style><script type="text/javascript">function foc(){zah()document.forms.myForm[0].focus()}function numberletter(){z = "0"while (z == "0"){x = document.forms.myForm[0].valuey = x.lengthif(y == 0){ return}for(i = 0;i<y;i++){ z = "0" for(j=0;j<10;j++) {  if(x.substring(i,i+1)==j)  {   z="1"  } } if(z=="0")   {  if(i==0)  {   document.forms.myForm[0].value=x.substring(1,y)  }  else  {   document.forms.myForm[0].value=x.substring(0,i)+x.substring(i+1,y)  }  i=99 }}}}function operator(operator){document.forms.myForm[17].value=operatordocument.forms.myForm[18].value=document.forms.myForm[0].valuedocument.forms.myForm[0].value=""}function alrt(){alert("BKAH")}function calculate(first,second,operator){if (first.length==0){alert("Please enter 2 numbers and an operator before calculating.");zah()return}if (second.length==0){alert("Please enter 2 numbers and an operator before calculating.");return}if (operator.length==0){alert("Please enter 2 numbers and an operator before calculating.");return}if (operator=='+'){var y=eval(first)+eval(second)document.forms.myForm[0].value=y}if (operator=='-'){var y=eval(first)-eval(second)document.forms.myForm[0].value=y}if (operator=='*'){var y=eval(first)*eval(second)document.forms.myForm[0].value=y}if (operator=='/'){var y=eval(first)/eval(second)document.forms.myForm[0].value=y}}function clrlast(){var v = document.forms.myForm[0].valuevar l = v.lengthif(l > 0){var b = v.substring(0,l-1)document.forms.myForm[0].value=b}}function zah(){document.forms.myForm[0].value=""document.forms.myForm[18].value=""document.forms.myForm[17].value=""}function called(num) //start function that recieves button clicks{var blah=document.forms.myForm[0].valuelength = blah.length //put the length of the text box into "length"if(!(num=='0' && length==0)) //checking if the first digit in the box is not 0{x=document.forms.myForm[0].valuey=x+numdocument.forms.myForm[0].value=y}num="" //undefine variableslength="" //""document.forms.myForm[21].value=blah}</script></head><body onload="foc()"><fieldset><form name="myForm"><center><table><tr><td colspan="4"><input class="window" type="text" dir="rtl" value="1" onchange="numberletter()"></td></tr><tr><td><input type="button" value="7" onclick="called('7')"></td><td><input type="button" value="8" onclick="called('8')"></td><td><input type="button" value="9" onclick="called('9')"></td><td><input type="button" value="+" onclick="operator('+')"></td></tr><tr><td><input type="button" value="4" onclick="called('4')"></td><td><input type="button" value="5" onclick="called('5')"></td><td><input type="button" value="6" onclick="called('6')"></td><td><input type="button" value="-" onclick="operator('-')"></td></tr><tr><td><input type="button" value="1" onclick="called('1')"></td><td><input type="button" value="2" onclick="called('2')"></td><td><input type="button" value="3" onclick="called('3')"></td><td><input type="button" value="*" onclick="operator('*')"></td></tr><tr><td><input type="button" value="0" onclick="called('0')"></td><td><input type="button" value="C" onclick="clrlast()"></td><td><input type="button" value="CA" onclick="zah()"></td><td><input type="button" value="/" onclick="operator('/')"></td></tr><tr><td colspan="2"><input type="hidden" value=""></td><td colspan="2"><input type="hidden" value=""></td></tr><tr><td colspan="4"><input class="sum" type="button" value="              =              "  onclick="calculate(document.forms.myForm[18].value,document.forms.myForm[0].value,document.forms.myForm[17].value)"></td></tr></table></center></form></fieldset></body>

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

×
×
  • Create New...