<!DOCTYPE html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Calculator</title> </head> <body> <p>Calculator</p> <input id="Calculator" type="text" /> <br> <br> <button type="button" onclick="plus()">+</button> <button type="button" onclick="minus()">-</button> <button type="button" onclick="multiply()">x</button> <button type="button" onclick="divide()">÷</button> <button type="button" onclick="Display0()">0</button> <button type="button" onclick="Display1()">1</button> <button type="button" onclick="Display2()">2</button> <button type="button" onclick="Display3()">3</button> <button type="button" onclick="Display4()">4</button> <button type="button" onclick="Display5()">5</button> <button type="button" onclick="Display6()">6</button> <button type="button" onclick="Display7()">7</button> <button type="button" onclick="Display8()">8</button> <button type="button" onclick="Display9()">9</button> <button type="button" onclick="CE()">CE</button> <button type="button" onclick="c()">C</button> <button type="button" onclick="Space()">Space</button> <button type="button" onclick="Odd()">Odd</button> <button type="button" onclick="Even()">Even</button> <button type="button" onclick="Min()">Min</button> <button type="button" onclick="Max()">Max</button> <button type="button" onclick="Avg()">Avg</button> <button type="button" onclick="Circle()">Circle</button> <button type="button" onclick="Rect()">Rect</button> <button type="button" onclick="Square()">Square</button> <button type="button" onclick="equals()">=</button> <script> function Number0() { document.getElementById("Calculator").value=0; } function Number1() { document.getElementById("Calculator").value=1; } function Number2() { document.getElementById("Calculator").value=2; } function Number3() { document.getElementById("Calculator").value=3; } function Number4() { document.getElementById("Calculator").value=4; } function Number5() { document.getElementById("Calculator").value=5; } function Number6() { document.getElementById("Calculator").value=6; } function Number7() { document.getElementById("Calculator").value=7; } function Number8() { document.getElementById("Calculator").value=8; } function Number9() { document.getElementById("Calculator").value=9; } // Holds the first number entered in the calculator screen var num1; // Holds the second number entered in the calculator screen var num2; // Holds the chosen operator var op=""; function Display0 () { current = document.getElementById("Calculator").value; current = current + "0"; document.getElementById("Calculator").value = current; } function Display1 () { current = document.getElementById("Calculator").value; current = current + "1"; document.getElementById("Calculator").value = current; } function Display2 () { current = document.getElementById("Calculator").value; current = current + "2"; document.getElementById("Calculator").value = current; } function Display3 () { current = document.getElementById("Calculator").value; current = current + "3"; document.getElementById("Calculator").value = current; } function Display4 () { current = document.getElementById("Calculator").value; current = current + "4"; document.getElementById("Calculator").value = current; } function Display5 () { current = document.getElementById("Calculator").value; current = current + "5"; document.getElementById("Calculator").value = current; } function Display6 () { current = document.getElementById("Calculator").value; current = current + "6"; document.getElementById("Calculator").value = current; } function Display7 () { current = document.getElementById("Calculator").value; current = current + "7"; document.getElementById("Calculator").value = current; } function Display8 () { current = document.getElementById("Calculator").value; current = current + "8"; document.getElementById("Calculator").value = current; } function Display9 () { current = document.getElementById("Calculator").value; current = current + "9"; document.getElementById("Calculator").value = current; } function c () { num1 = document.getElementById("Calculator").value; num1 = parseInt (num1); op = ""; } // this clears function clear (){ } function plus() { num1 = document.getElementById("Calculator").value; num1 = parseInt (num1); op = "plus"; } // takes two numbers and adds them up function add (x, y){ return (x+y); } function multiply() { num1 = document.getElementById("Calculator").value; num1 = parseInt (num1); op = "multiply"; } // takes two numbers and multiplies them function multi (x, y){ return (x*y); } function minus() { num1 = document.getElementById("Calculator").value; num1 = parseInt (num1); op = "minus"; } // takes two numbers and minuses them function sub (x, y){ return (x-y); } function divide() { num1 = document.getElementById("Calculator").value; num1 = parseInt (num1); op = "divide"; } // takes two numbers and divide them function divideIt (x, y){ return (x/y); } function equals () { // get the current number from the textbox num2 = document.getElementById("Calculator").value; num2 = parseInt (num2); // find which operation has been selected and apply it switch (op) { case "plus": res = add (num1, num2); break; case "multiply": res = multi (num1, num2); break; case "minus": res = sub (num1, num2); break; case "divide": res = divideIt (num1, num2); break; case "c": res = clear (num1, num2); break; default: res = 0; break; } // display the result document.getElementById("Calculator").value = res; //reset the operation and the numbers op=""; num1=0; num2=0; } </script> </body> </html>