|
Easy Code for Screen Tape Adding Machine
By Stephen Bucaro
Have you ever tried to add a column of numbers with a regular calculator?
If you make a mistake, you have to start all over with the first number.
Do you remember those old paper-tape adding machines that printed a strip
as you entered numbers? In this article, I show you how to use simple
Java Script to create a similar tape adding machine, except the tape is
on your computer screen, not on paper.
To see a working example of the Screen Tape Adding Machine,
click here.
As with all my other Easy Code articles, I'll give you cut-and-paste
Java Script code and I'll explain the code in detail so that you can use it
and modify it for your own requirements. You can put a copy of the Screen
Tape Adding Machine on your own webpage for other's to use.
Before we design the complete Screen Tape Adding Machine, Let's do
a few tutorial examples in order to learn the basics. For example, how do we
get the contents of a text box and place it in another text box?
Place the code shown below in the <body> section of your webpage.
<form>
<input id="c1" type="text" onkeypress="return noenter()" /><br />
Total: <input id="total" type="text" />
</form>
This code creates a simple form with two text boxes. Each text box has a
unique id attribute. The onkeypress event of the first text box
executes a function named noenter. Place the code for the noenter
function, shown below, in the <head> section of your webpage.
<script language="JavaScript">
function noenter()
{
if(window.event.keyCode == 13)
{
document.getElementById("total").value = document.getElementById("c1").value;
return false;
}
}
</script>
This code creates a Java Script code block containing the noenter
function. The if statement within the noenter function checks
if the user pressed the keyboard [Enter] key. If they did, the document's
getElementById method is used to retrieve the value property of
the text box with the id c1, and place it in the value property of
the text box with the id total.
Note that the noenter function returns false. This prevents the
form from being submitted.
| 
Free Downloads
RSS Feed