Write a javascript program to make a simple calculator
Answers were Sorted based on User's Feedback
Answer / raghu
Actually we already known simple calculator means such like
addition, subraction,division, multiplication.those things
are coding by switch case method.
| Is This Answer Correct ? | 114 Yes | 44 No |
<html>
<head>
<title>A simple JavaScript calculator</title>
<script language='JavaScript'>
Default = "0";
Current = "0";
Operation = 0;
MaxLength = 30;
function AddDigit(dig) {
if (Current.indexOf("!") == -1) {
if ((eval(Current) == 0) && (Current.indexOf(".") == -1)) {
Current = dig;
} else {
Current = Current + dig;
}
Current = Current.toLowerCase();
} else {
Current = "Hint! Press 'AC'";
}
if (Current.indexOf("e0") != -1) {
var epos = Current.indexOf("e");
Current = Current.substring(0,epos+1) + Current.substring(epos+2);
}
if (Current.length > MaxLength) {
Current = "Too long";
}
document.Calculator.Display.value = Current;
}
function Dot() {
if ( Current.length == 0) {
Current = "0.";
} else {
if (( Current.indexOf(".") == -1) && (Current.indexOf("e") == -1)) {
Current = Current + ".";
}
}
document.Calculator.Display.value = Current;
}
function DoExponent() {
if ( Current.indexOf("e") == -1 ) {
Current = Current + "e0";
document.Calculator.Display.value = Current;
}
}
function PlusMinus() {
if(Current.indexOf("e") != -1) {
var epos = Current.indexOf("e-");
if (epos != -1) {
Current = Current.substring(0,1+epos) + Current.substring(2+epos);
} else { epos = Current.indexOf("e");
Current = Current.substring(0,1+epos) + "-" + Current.substring(1+epos);
}
} else {
if ( Current.indexOf("-") == 0 ) {
Current = Current.substring(1);
} else {
Current = "-" + Current;
}
if ((eval(Current) == 0) && (Current.indexOf(".") == -1 )) {
Current = "0"; }
}
document.Calculator.Display.value = Current;
}
function Clear() {
Current = "0";
document.Calculator.Display.value = Current;
}
function AllClear() {
Current = "0";
Operation = 0;
Default = "0";
document.Calculator.Display.value = Current;
}
function Operate(op) {
if (Operation != 0) { Calculate(); };
if (op.indexOf("*") > -1) { Operation = 1; };
if (op.indexOf("/") > -1) { Operation = 2; };
if (op.indexOf("+") > -1) { Operation = 3; };
if (op.indexOf("-") > -1) { Operation = 4; };
Default = Current;
Current = "";
document.Calculator.Display.value = Current;
}
function Calculate() {
if (Operation == 1) { Current = eval(Default) * eval(Current); };
if (Operation == 2) {
if (eval(Current) != 0) {
Current = eval(Default) / eval(Current)
} else {
Current = "Divide by zero";
}
}
if (Operation == 3) { Current = eval(Default) + eval(Current); };
if (Operation == 4) { Current = eval(Default) - eval(Current); };
Operation = 0;
Default = "0";
Current = Current + "";
if (Current.indexOf("Infinity") != -1) {
Current = "Value too big";
}
if (Current.indexOf("NaN") != -1) {
Current = "I don't understand";
}
document.Calculator.Display.value = Current;
}
function FixCurrent() {
Current = document.Calculator.Display.value;
Current = "" + parseFloat(Current);
if (Current.indexOf("NaN") != -1) {
Current = "I don't understand";
}
document.Calculator.Display.value = Current;
}
</script>
</head>
<hr><div align="center">
<FORM name="Calculator">
<table width="40%" height="40%" border="4" bgcolor="#FFEBCD"><tr>
<td colspan="2" align="center">
<b><font face="Verdana, Arial, Helvetica" color="#000080" size="3">
A Simple JavaScript Calculator<br></font>
<font face="Courier" size="5">
<input type="text" maxlength="40" size="25" name="Display" onChange="FixCurrent()">
</font></b>
</td></tr>
<tr><td width="65%" align="center">
<table><tr>
<td><input type="button" name="seven" value=" 7 " OnClick="AddDigit('7')"></td>
<td><input type="button" name="eight" value=" 8 " OnClick="AddDigit('8')"></td>
<td><input type="button" name="nine" value=" 9 " OnClick="AddDigit('9')"></td>
</tr><tr>
<td><input type="button" name="four" value=" 4 " OnClick="AddDigit('4')"></td>
<td><input type="button" name="five" value=" 5 " OnClick="AddDigit('5')"></td>
<td><input type="button" name="six" value=" 6 " OnClick="AddDigit('6')"></td>
</tr><tr>
<td><input type="button" name="one" value=" 1 " OnClick="AddDigit('1')"></td>
<td><input type="button" name="two" value=" 2 " OnClick="AddDigit('2')"></td>
<td><input type="button" name="three" value=" 3 " OnClick="AddDigit('3')"></td>
</tr><tr>
<td><input type="button" name="plusmin" value=" +/- " OnClick="PlusMinus()"></td>
<td><input type="button" name="one" value=" 0 " OnClick="AddDigit('0')"></td>
<td><input type="button" name="two" value=" . " OnClick="Dot()"></td>
</tr>
</table>
</td>
<td width="35%" align="center">
<table><tr>
<td><input type="button" name="clear" value=" C " OnClick="Clear()"></td>
<td><input type="button" name="AC" value=" AC " OnClick="AllClear()"></td>
</tr><tr>
<td><input type="button" name="mul" value=" * " OnClick="Operate('*')"></td>
<td><input type="button" name="div" value=" / " OnClick="Operate('/')"></td>
</tr><tr>
<td><input type="button" name="add" value=" + " OnClick="Operate('+')"></td>
<td><input type="button" name="sub" value=" - " OnClick="Operate('-')"></td>
</tr><tr>
<td><input type="button" name="result" value=" = " OnClick="Calculate()"></td>
<td align="right"><input type="button" name="exp" value=" EXP " OnClick="DoExponent()"></td>
</tr></table>
</td>
</tr></table>
</div></body>
</html>
| Is This Answer Correct ? | 68 Yes | 26 No |
Answer / raghav seth
html>
<form name="calculator">
<table border=4>
<tr>
<td>
<input type="text" name="text" size="18">
<br>
</td>
</tr>
<tr>
<td>
<input type="button" value="1" onclick="calculator.text.value += '1'">
<input type="button" value="2" onclick="calculator.text.value += '2'">
<input type="button" value="3" onclick="calculator.text.value += '3'">
<input type="button" value="+" onclick="calculator.text.value += ' + '">
<br>
<input type="button" value="4" onclick="calculator.text.value += '4'">
<input type="button" value="5" onclick="calculator.text.value += '5'">
<input type="button" value="6" onclick="calculator.text.value += '6'">
<input type="button" value="-" onclick="calculator.text.value += ' - '">
<br>
<input type="button" value="7" onclick="calculator.text.value += '7'">
<input type="button" value="8" onclick="calculator.text.value += '8'">
<input type="button" value="9" onclick="calculator.text.value += '9'">
<input type="button" value="*" onclick="calculator.text.value += ' * '">
<br>
<input type="button" value="c" onclick="calculator.text.value = ''">
<input type="button" value="0" onclick="calculator.text.value += '0'">
<input type="button" value="=" onclick="calculator.text.value = eval(calculator.text.value)">
<input type="button" value="/" onclick="calculator.text.value += ' / '">
<br>
</td>
</tr>
</table>
</form>
</html>
| Is This Answer Correct ? | 63 Yes | 21 No |
Answer / rehan
<html>
<head><title>Calculator</title>
<script language="javascript">
var inputstring=" "
function updatestring(value)
{
inputstring += value;
document.calculator.input.value=inputstring;
}
</script>
</head>
<body background=flow-yellow.jpg>
<form name="calculator">
<table border=5 bordercolor=pink bgcolor="#ffffcc"><tr ><td>
<input type="text" name="input" maxlength=15 size=27><br />
<input type="button" value=" clear " onclick="input.value=' ';inputstring=' ' ">
<input type="button" value=" mod " onclick="updatestring('%')">
<input type="button" value=" * " onclick="updatestring('*')"><br />
<input type="button" value=" 7 " onclick="updatestring('7')">
<input type="button" value=" 8 " onclick="updatestring('8')">
<input type="button" value=" 9 " onclick="updatestring('9')">
<input type="button" value=" / " onclick="updatestring('/')"><br />
<input type="button" value=" 4 " onclick="updatestring('4')">
<input type="button" value=" 5 " onclick="updatestring('5')">
<input type="button" value=" 6 " onclick="updatestring('6')">
<input type="button" value=" - " onclick="updatestring('-')"><br />
<input type="button" value=" 1 " onclick="updatestring('1')">
<input type="button" value=" 2 " onclick="updatestring('2')">
<input type="button" value=" 3 " onclick="updatestring('3')">
<input type="button" value=" + " onclick="updatestring('+')"><br />
<input type="button" value=" 0 " onclick="updatestring('0')">
<input type="button" value=" 00 " onclick="updatestring('00')">
<input type="button" value=" . " onclick="updatestring('.')">
<input type="button" value=" = " onclick="input.value=eval(inputstring);">
</td></tr>
</table>
</form>
</body>
</html>
| Is This Answer Correct ? | 32 Yes | 13 No |
Answer / vinoth180
var a=20;
var b=11;
document.writeln("ADDITION:",a+b,"<br>");
document.writeln("SUB:",a-b,"<br>");
document.writeln("MUL:",a*b,"<br>");
document.writeln("MUL:",a%b,"<br>");
| Is This Answer Correct ? | 47 Yes | 33 No |
Answer / ruchi goswami
<html>
<head>
<link rel="stylesheet" type="text/css" href="css2.css">
<title> calculator </title>
</head>
<body>
<div id="wrap">
<h1> Calculator </h1>
<b> enter first number </b>
                   
<b> enter second number </b>
<form action="">
<input type="text" name="firstnum" id="first">
                   
<input type="text" name="lastnum" id="second">
</form>
<br> </br>
<button onclick="sum()"> + </button>
               
<button onclick="sub()"> - </button>
               
<button onclick="mul()"> * </button>
               
<button onclick="divi()"> / </button>
<br> </br>
<input type="text" id="result">
<p id="demo"></p>
<script>
function sum()
{
var a = Number(document.getElementById("first").value);
var b = Number(document.getElementById("second").value);
c = a+b;
document.getElementById("result").value = c;
}
function sub()
{
var a = Number(document.getElementById("first").value);
var b = Number(document.getElementById("second").value);
c = a-b;
document.getElementById("result").value = c;
}
function mul()
{
var a = Number(document.getElementById("first").value);
var b = Number(document.getElementById("second").value);
c = a*b;
document.getElementById("result").value = c;
}
function divi()
{
var a = Number(document.getElementById("first").value);
var b = Number(document.getElementById("second").value);
c = a/b;
document.getElementById("result").value = c;
}
</script>
</div>
</body>
</html>
| Is This Answer Correct ? | 15 Yes | 1 No |
Answer / mehta fenil & bodiwala rum
<html>
<head>
<title>Basic Calculator</title>
<script language="JavaScipt" type="text/JavaScript">
var adddigit=false;
var oldval=0;
var op="=";
function btnconcat(c)
{
if(adddigit)
{
document.getElementById("txtdisplay").value+=c;
}
else
{
document.getElementById("txtdisplay").value=c;
adddigit=true;
}
}
function operation(newop)
{
var newarg=eval(document.getElementById("txtdisplay").value)
if(op=="+")
{
oldval=oldval+newarg;
}
else if(op=="-")
{
oldval=oldval-newarg;
}
else if(op=="*")
{
oldval=oldval*newarg;
}
else if(op=="/")
{
oldval=oldval/newarg;
}
else if(op=="=")
{
oldval=newarg;
}
else
{
oldval=newarg;
}
document.getElementById("txtdisplay").value=oldval;
adddigit=false;
op=newop;
}
function backspace()
{
document.getElementById("txtdisplay").value=document.getElementById("txtdisplay").value.substring(0,document.getElementById("txtdisplay").value.length*1-1);
}
function btnce()
{
document.getElementById("txtdisplay").value="";
}
function btnc()
{
document.getElementById("txtdisplay").value=0;
oldval=0;
adddigit=false;
op="=";
}
</script>
</head>
<body>
<center>
<table border=5 cellpading=5 cellspacing=5>
<tr>
<td colspan="4"><input type="text" id="txtdisplay"
size="25" style="text-align:right"></td>
</tr>
<tr>
<td>
<center>
<input type="button" id="btnc" value="C"
onClick="btnc();">
</center>
</td>
<td>
</td>
<td>
<center>
<input name="Button" type="button" id="btnc"
onClick="btnce();" value="CE">
</center>
</td>
<td>
<center>
<input type="button" id="btnc" value="<="
onClick="backspace();">
</center>
</td>
</tr>
<tr>
<td>
<center>
<input type="button" id="btn7" value="7"
onClick="btnconcat(7);">
</center>
</td>
<td>
<center>
<input type="button" id="btn8" value="8"
onClick="btnconcat(8);">
</center>
</td>
<td>
<center>
<input type="button" id="btn9" value="9"
onClick="btnconcat(9);">
</center>
</td>
<td>
<center>
<input type="button" id="btnpls" value="+"
onClick="operation('+');">
</center>
</td>
</tr>
<tr>
<td>
<center>
<input type="button" id="btn4" value="4"
onClick="btnconcat(4);">
</center>
</td>
<td>
<center>
<input type="button" id="btn5" value="5"
onClick="btnconcat(5);">
</center>
</td>
<td>
<center>
<input type="button" id="btn6" value="6"
onClick="btnconcat(6);">
</center>
</td>
<td>
<center>
<input type="button" id="btnmin" value="-"
onClick="operation('-');">
</center>
</td>
</tr>
<tr>
<td>
<center>
<input type="button" id="btn1" value="1"
onClick="btnconcat(1);">
</center>
</td>
<td>
<center>
<input type="button" id="btn2" value="2"
onClick="btnconcat(2);">
</center>
</td>
<td>
<center>
<input type="button" id="btn3" value="3"
onClick="btnconcat(3);">
</center>
</td>
<td>
<center>
<input type="button" id="btnmul" value="*"
onClick="operation('*');">
</center>
</td>
</tr>
<tr>
<td>
<center>
<input type="button" id="btnpoi" value="."
onClick="btnconcat('.');">
</center>
</td>
<td>
<center>
<input type="button" id="btn0" value="0"
onClick="btnconcat(0);">
</center>
</td>
<td>
<center>
<input type="button" id="btneql" value="="
onClick="operation(value)">
</center>
</td>
<td>
<center>
<input type="button" id="btndiv" value="/"
onClick="operation('/');">
</center>
</td>
</tr>
</table>
</center>
</body>
</html>
| Is This Answer Correct ? | 12 Yes | 3 No |
Answer / san
<html>
<form name="cals">
<table border=1>
<tr>
<td>
<input type="text" name="text" size=15>
</td>
</tr>
<br>
<tr>
<td>
<input type="button" value="1" onclick="cals.text.value +='1'">
<input type="button" value="2" onclick="cals.text.value +='2'">
<input type="button" value="3" onclick="cals.text.value +='3'">
<input type="button" value="+" onclick="cals.text.value +='+'">
<br>
<input type="button" value="4" onclick="cals.text.value +='4'">
<input type="button" value="5" onclick="cals.text.value +='5'">
<input type="button" value="6" onclick="cals.text.value +='6'">
<input type="button" value="- " onclick="cals.text.value +='-'">
<br>
<input type="button" value="7" onclick="cals.text.value +='7'">
<input type="button" value="8" onclick="cals.text.value +='8'">
<input type="button" value="9" onclick="cals.text.value +='9'">
<input type="button" value="*" onclick="cals.text.value +='*'">
<br>
<input type="button" value="c" onclick="cals.text.value =''">
<input type="button" value="0" onclick="cals.text.value +='0'">
<input type="button" value="=" onclick="cals.text.value = eval(cals.text.value)">
<input type="button" value="/" onclick="cals.text.value +=' /'">
<br>
</td>
</tr>
</table>
</form>
</html>
| Is This Answer Correct ? | 11 Yes | 7 No |
Answer / s.suresh
<html>
<form name="calculator">
<table border=4>
<tr>
<td>
<input type="text" name="text" size="18">
<br>
</td>
</tr>
<tr>
<td>
<input type="button" value="1"
onclick="calculator.text.value += '1'">
<input type="button" value="2"
onclick="calculator.text.value += '2'">
<input type="button" value="3"
onclick="calculator.text.value += '3'">
<input type="button" value="+"
onclick="calculator.text.value += ' + '">
<br>
<input type="button" value="4"
onclick="calculator.text.value += '4'">
<input type="button" value="5"
onclick="calculator.text.value += '5'">
<input type="button" value="6"
onclick="calculator.text.value += '6'">
<input type="button" value="-"
onclick="calculator.text.value += ' - '">
<br>
<input type="button" value="7"
onclick="calculator.text.value += '7'">
<input type="button" value="8"
onclick="calculator.text.value += '8'">
<input type="button" value="9"
onclick="calculator.text.value += '9'">
<input type="button" value="*"
onclick="calculator.text.value += ' * '">
<br>
<input type="button" value="c"
onclick="calculator.text.value = ''">
<input type="button" value="0"
onclick="calculator.text.value += '0'">
<input type="button" value="="
onclick="calculator.text.value = eval(calculator.text.value)">
<input type="button" value="/"
onclick="calculator.text.value += ' / '">
<br>
</td>
</tr>
</table>
</form>
</html>
| Is This Answer Correct ? | 11 Yes | 8 No |
Answer / krishna
<html>
<form name="calculator">
<table border=4>
<tr>
<td>
<input type="text" name="text" size="18">
<br>
</td>
</tr>
<tr>
<td>
<input type="button" value="1" onclick="calculator.text.value += '1'">
<input type="button" value="2" onclick="calculator.text.value += '2'">
<input type="button" value="3" onclick="calculator.text.value += '3'">
<input type="button" value="+" onclick="calculator.text.value += ' + '">
<br>
<input type="button" value="4" onclick="calculator.text.value += '4'">
<input type="button" value="5" onclick="calculator.text.value += '5'">
<input type="button" value="6" onclick="calculator.text.value += '6'">
<input type="button" value="-" onclick="calculator.text.value += ' - '">
<br>
<input type="button" value="7" onclick="calculator.text.value += '7'">
<input type="button" value="8" onclick="calculator.text.value += '8'">
<input type="button" value="9" onclick="calculator.text.value += '9'">
<input type="button" value="*" onclick="calculator.text.value += ' * '">
<br>
<input type="button" value="c" onclick="calculator.text.value = ''">
<input type="button" value="0" onclick="calculator.text.value += '0'">
<input type="button" value="=" onclick="calculator.text.value = eval(calculator.text.value)">
<input type="button" value="/" onclick="calculator.text.value += ' / '">
<br>
</td>
</tr>
</table>
</form>
</html>
| Is This Answer Correct ? | 8 Yes | 5 No |
What is the use of history object?
What are javascript closures?
why we calld java object orinted programming language??
How are event handlers utilized in javascript?
Is javascript multi-threaded or single-threaded?
How to create a function in javascript?
What is event in javascript?
What is javascript used for on iphone?
What does the delete operator do?
In javascript what is an argument object?
What is design pattern in javascript? Explain
What is lazy instantiation in java?