Lab assignment: Take the script from the lecture and modify it to a full-fledged calculator. It can stay simple, with three textboxes and four buttons (using two textboxes as "entry" boxes and the third as an answer box, then with buttons for addition, subtraction, multiplication and division.
Source:
<head>
<script language="javascript" type="text/javascript">
<!--
function add(number1,number2){
total = parseFloat(number1) + parseFloat(number2);
document.testForm.number3.value = total;
}
function sub(number1,number2){
total = parseFloat(number1) - parseFloat(number2);
document.testForm.number3.value = total;
}
function div(number1,number2){
total = parseFloat(number1) / parseFloat(number2);
document.testForm.number3.value = total;
}
function mult(number1,number2){
total = parseFloat(number1) * parseFloat(number2);
document.testForm.number3.value = total;
}
//-->
</script>
<head>
<body>
<form name="testForm" id="testForm"> <table width="300" height="100" frame="box" rules="all" cellpadding="4"> <tr> <td width="33%"> Value 1</td> <td width="33%"> Value 2</td> <td> Sum</td> </tr> <tr height="40"> <td> <input type="text" name="number1" size="10"> </td> <td> <input type="text" name="number2" size="10"> </td> <td> <input type="text" name="number3" size="10"> </td> </tr> <tr> <td colspan="3"> <input type="submit" value=" + " name="plus" onclick="add(document.testForm.number1.value,document.testForm.number2.value);return false;"> <input type="submit" value=" - " name="subtraction" onclick="sub(document.testForm.number1.value,document.testForm.number2.value);return false;"> <input type="submit" value=" / " name="divi" onclick="div(document.testForm.number1.value,document.testForm.number2.value);return false;"> <input type="submit" value=" x " name="multi" onclick="mult(document.testForm.number1.value,document.testForm.number2.value);return false;"> </td> </tr> </table> </form>
</body>