Title Basic Calculator using HTML & Javascript. Author: Patrick M. D Souza Visitor Submitted Source Code Author Email: patrick_dsouza13@yahoo.co.in Description: Hits: 3049 Since 25th November, 2003 Code: Select and Copy the Code <html> <head><title>Calculator</title></head> <script> var MAXSIZE=50; items=new Array(100); var top=-1; function empty() { if (top==-1) return (1); else return (0); } function push(x) { if (top>(MAXSIZE-1)){ alert("OVERFLOW");} else{ items[++top]=x; } } function pop() { if (top==-1) {alert("EMPTY")} return items[top--]; } flag=0; function isNum(p) { for(i=0;i<p.length;i++) { a=parseInt(p.charAt(i)); if(a>=0 || a<=9) return true; } return false; } function ch_t1(x) { v=document.f1.t1.value; for(i=0;i<v.length;i++) { if(v.substring(i,i+1)=='.') flag=1; } if(x=='.') { if(flag==1); else document.f1.t1.value+=x; } else document.f1.t1.value+=x; } function ch_t2() { x=document.f1.t1.value; if(x!="") { v=x.length; if(x.substring(v-2,v-1)=='.') flag=0; x=x.substring(0,v-1); document.f1.t1.value=x; } } function clear_t1() { flag=0; ans=0; f=0; top=-1 document.f1.t1.value=''; document.getElementById('t2').innerHTML = ""; for(i=0;i<=top;i++) document.getElementById('t2').innerHTML+=items[i]; } ans=0; f=0; function ispat(x) { if((x=='+')||(x=='-')||(x=='*')||(x=='/')) return true; else return false; } function eval_t1(y) { flag=0; if(!isNum(document.f1.t1.value)) { alert("Please enter (0-9) or +-*/"); document.f1.t1.value=''; } else { if(empty()) { push(document.f1.t1.value); } else { if(ispat(items[top]) && isNum(document.f1.t1.value)) { op=pop(); a=pop(); a=parseFloat(a); b=parseFloat(document.f1.t1.value); alert(a+op+b); switch(op) { case '+': {ans=eval(a+b); document.f1.t1.value=ans; push(ans); break; } case '-': {ans=eval(a-b); document.f1.t1.value=ans; push(ans); break; } case '*': {ans=eval(a*b); document.f1.t1.value=ans; push(ans); break; } case '/': { if(b==0) { document.f1.t1.value=''; alert("Divide by zero error"); ans=0;f=0; push(a); //push(op); } else {ans=eval(a/b); document.f1.t1.value=ans; push(ans); } break; } } } } if(ispat(y)) {push(y); document.f1.t1.value=''; } else{ if(y=='=') document.f1.t1.value=items[0]; } document.getElementById('t2').innerHTML = ""; for(i=0;i<=top;i++) document.getElementById('t2').innerHTML+=items[i]; } } </script> <style> but1{border-left:#000000 solid 1px;border-right:#000000 solid 1px;border-top:#000000 solid 1px;border-bottom:#000000 solid 1px;background-color:#ffffff;width:30;height:30} tex{border-left:#000000 solid 1px;border-right:#000000 solid 1px;border-top:#000000 solid 1px;border-bottom:#000000 solid 1px;background-color:#ffffff;text-align:right;width:100%;height:20} but{border-left:#000000 solid 1px;border-right:#000000 solid 1px;border-top:#000000 solid 1px;border-bottom:#000000 solid 1px;background-color:#ffffff;width:30;height:25} </style> <body bgcolor=#888888> <form name=f1> <table cellspacing=1 cellpadding=1 style="background-color:#000000;border:#cccccc solid 2px;border-style:groove" align=center > <tr><td style="color:gold;font-weight:bold;text-align:center">CALCULATOR</td></tr> <tr><td><input type=text class="tex" name=t1></input></td></tr> <tr><td><span id=t2 style="color:#ffffff;font-weight:bold"></span></td></tr> <tr><td><input type=button value='Backspace' onclick="ch_t2()" class=but style="width:65;font-size:9pt"></input> <input type=button value='CE' class=but onclick="clear_t1();"></input> <input type=button value='C' class=but onclick="document.f1.t1.value=''"></input></td></tr> <tr><td> <table width=100% cellpadding=1 cellspacing=1> <tr> <td><input type=button value=7 class=but1 onclick="ch_t1(this.value)"></input></td> <td><input type=button value=8 class=but1 onClick="ch_t1(this.value)"></input></td> <td><input type=button value=9 class=but1 onClick="ch_t1(this.value)"></input></td> <td><input type=button value=/ class=but1 onclick="eval_t1(this.value)"></input></td> </tr> <tr> <td><input type=button value= 4 class=but1 onClick="ch_t1(this.value)"></input></td> <td><input type=button value=5 class=but1 onClick="ch_t1(this.value)"></input></td> <td><input type=button value=6 class=but1 onClick="ch_t1(this.value)"></input></td> <td><input type=button value=* onclick="eval_t1(this.value)" class=but1></input></td> </tr> <tr><td><input type=button value=3 class=but1 onClick="ch_t1(this.value)"></input></td> <td><input type=button value=2 class=but1 onClick="ch_t1(this.value)"></input></td> <td><input type=button value=1 class=but1 onClick="ch_t1(this.value)"></input></td> <td><input type=button value='-' onclick="eval_t1(this.value)" class=but1></input></td> </tr> <tr> <td><input type=button value=0 class=but1 onClick="ch_t1(this.value)"></input></td> <td><input type=button value='=' class=but1 onclick="eval_t1(this.value)"></input></td> <td><input type=button value='.' onClick="ch_t1(this.value)" class=but1></input></td> <td><input type=button value='+' class=but1 onclick="eval_t1(this.value)"></input></td> </tr> </table> </td></tr> <tr><td style="color:#ffffff;font-size:9pt" align=center>Version 1.0 Copyright<br>©2004 Patrick M. D'Souza</td></tr> </table> </body>