Welcome to the second part of a six-part series on how to build a calculator for your web page. In the previous part, we got into the basics of setting up the calculator's layout and what functions we want it to have. In this part, we will begin to code the functions.
Coding a Web Page Calculator - The showNum() Function (Page 3 of 5 )
This is the skeleton of the showNum() with its associated global variable:
var showNumCalledOnce = false;
function showNum(ID)
{
//remove the initial zero in the Input Control unless the user began by typing 0 or the decimal point.
//Clear the display (Input Text Control) if -, +, X or / button has been clicked
switch (ID)
{
case "B0":
//display zero or add it on the right of a previous digit.
break;
case "B1":
//display 1 or add it on the right of a previous digit.
break;
case "B2":
---
break;
case "B3":
---
break;
case "B4":
---
break;
case "B5":
---
break;
case "B6":
---
break;
case "B7":
---
break;
case "B8":
---
break;
case "B9":
---
break;
case "BPOINT":
//display the decimal point or add it on the right of a previous digit.
break;
case "BRM":
//Store the number on the display
break;
case "BPM":
//Show the number stored on the display.
break;
}
//remove any leading zeros before you process a number.
}
When the calculator is opened, the initial number on the display is zero. When the user then types a digit, such as 5, you should see 5 and not 05. The global variable, showNumCalledOnce, is used to remove that preceding zero.
The above function has as argument, the ID of the button pressed. Read though the skeleton, taking note of the comments. There is a switch statement. When a digit button is clicked, it calls the above function, sending its ID as argument. The switch statement uses the ID to display the corresponding digit.
HTML 
Using the Keyboard with a Web Page Calculator
