|
|||||||||
|
|
|
|
Book of tasks on programming. Old version |
| xsl, study material, class, school, applet, education, servlet, examples, program |
Calculator in JavaScript
Doesn't calculator work? Maybe JavaScript is not switched on.
Calculator in JavaScript consist of two parts. First part are functions - handlers of calculator's buttons, auxiliary functions and declarations of variables. This part is situated between tags <script> and </script>. Second part is in body of HTML-page. This part is a form containing calculator's buttons and fields connected with functions-handlers.<html>
<head>
...
<title> .... </title>
...
<script LANGUAGE="javascript">
var First_Number = '0';
var Second_Number = '0';
var View_Second_Number = '0';
var xx='0';
var Digit_Char='0';
var Digit_Int=0;
var n1 = 0;
var n2 = 0;
var m1 = 0;
var m2 = 0;
function but_aa_press()
{
if (Second_Number.length<5) {
if (Second_Number=='0') {
Second_Number= xx; }
else
{ Second_Number=Second_Number+xx; }
}
}
function but0_press()
{
xx='0';
but_aa_press();
xx_label();
}
function but1_press()
{
xx='1';
but_aa_press();
xx_label();
}
function but2_press()
{
xx='2';
but_aa_press();
xx_label();
}
function but3_press()
{
xx='3';
but_aa_press();
xx_label();
}
function but4_press()
{
xx='4';
but_aa_press();
xx_label();
}
function but5_press()
{
xx='5';
but_aa_press();
xx_label();
}
function but6_press()
{
xx='6';
but_aa_press();
xx_label();
}
function but7_press()
{
xx='7';
but_aa_press();
xx_label();
}
function but8_press()
{
xx='8';
but_aa_press();
xx_label();
}
function but9_press()
{
xx='9';
but_aa_press();
xx_label();
}
function but_Clear_press()
{
Second_Number= '0';
xx_label();
}
function but_Plus_press()
{
First_Number= Second_Number;
Second_Number='0';
xx_label();
}
function Aux_Digit()
{
Digit_Int=0;
if (Digit_Char=='1') Digit_Int=1;
if (Digit_Char=='2') Digit_Int=2;
if (Digit_Char=='3') Digit_Int=3;
if (Digit_Char=='4') Digit_Int=4;
if (Digit_Char=='5') Digit_Int=5;
if (Digit_Char=='6') Digit_Int=6;
if (Digit_Char=='7') Digit_Int=7;
if (Digit_Char=='8') Digit_Int=8;
if (Digit_Char=='9') Digit_Int=9;
}
function but_Equal_press()
{
n1 = 0;
n2 = 0;
for (var i=0; i < First_Number.length; i++) {
Digit_Char=First_Number.charAt(i);
Aux_Digit();
m1=Digit_Int;
n1=(n1*10)+m1; }
for (var i=0; i < Second_Number.length; i++) {
Digit_Char=Second_Number.charAt(i);
Aux_Digit();
m2=Digit_Int;
n2=(n2*10)+m2; }
n1=n1+n2;
Second_Number = ''+n1;
xx_label();
}
function xx_label()
{
View_Second_Number='0';
for (var i=0; i < 7 - Second_Number.length; i++) {
View_Second_Number=View_Second_Number+'0';
}
View_Second_Number=View_Second_Number+Second_Number;
if (document.all) {
document.all.lab1.innerHTML = View_Second_Number;
}
else {
document.layers["lab1"].document.open();
document.layers["lab1"].document.write(View_Second_Number);
document.layers["lab1"].document.close();
}
}</script>
</head>
<body>
...
<form NAME="0">
<table border="1" cellpadding="0" cellspacing="0" bgcolor="E0E0E4" frcolor="000000">
<tr>
<td id="lab1" border="1" height="25" width="60" background="patten_224_224_228.gif"></td>
</tr>
</table>
<table border="0" cellpadding="0" cellspacing="0" bgcolor="E0E0E4" frcolor="000000">
<tr>
<td height="25" width="60"><input TYPE="button" ONCLICK="but_Clear_press()"
value=" CLR " width="70"></td>
</tr>
</table>
<table border="0" cellpadding="0" cellspacing="0">
<tr>
<td height="15" width="15"><input TYPE="button" ONCLICK="but1_press()" value=" 1 "> </td>
<td height="15" width="15"><input TYPE="button" ONCLICK="but2_press()" value=" 2 "> </td>
<td height="15" width="15"><input TYPE="button" ONCLICK="but3_press()" value=" 3 "> </td>
</tr>
<tr>
<td height="15" width="15"><input TYPE="button" ONCLICK="but4_press()" value=" 4 "> </td>
<td height="15" width="15"><input TYPE="button" ONCLICK="but5_press()" value=" 5 "> </td>
<td height="15" width="15"><input TYPE="button" ONCLICK="but6_press()" value=" 6 "> </td>
</tr>
<tr>
<td height="15" width="15"><input TYPE="button" ONCLICK="but7_press()" value=" 7 "> </td>
<td height="15" width="15"><input TYPE="button" ONCLICK="but8_press()" value=" 8 "> </td>
<td height="15" width="15"><input TYPE="button" ONCLICK="but9_press()" value=" 9 "> </td>
</tr>
<tr>
<td height="15" width="15"><input TYPE="button" ONCLICK="but_Plus_press()" value=" + "> </td>
<td height="15" width="15"><input TYPE="button" ONCLICK="but0_press()" value=" 0 "> </td>
<td height="15" width="15"><input TYPE="button" ONCLICK="but_Equal_press()" value=" = "> </td>
</tr>
</table>
</form>
...
</body>
</html>
|