<!--Creating Calculator using Javascript....fensasaj@blogspot.com-->
<html>
<head>
<script type="text/javascript">
function pushButton(buttonValue) {
if (buttonValue == 'C') {
document.getElementById('screen').value = '';
}
else {
document.getElementById('screen').value += buttonValue;
}
}
function calculate(equation) {
var answer = eval(equation);
document.getElementById('screen').value = answer;
}
</script>
</head>
<body>
<style type="text/css">
table.calc {
border: 2px solid #0034D1;
background-color: #809FFF;
}
input.calc {
width: 100%;
margin: 5px;
}
</style>
<fieldset>
<legend>Calculator</legend>
<table class="calc" cellpadding=4>
<tr><td colspan=3><input class="calc" id="screen" type="text"></td></tr>
<tr>
<td><input class="calc" type="button" value=1 onclick="pushButton(this.value);"></td>
<td><input class="calc" type="button" value=2 onclick="pushButton(this.value);"></td>
<td><input class="calc" type="button" value=3 onclick="pushButton(this.value);"></td>
<td><input class="calc" type="button" value='/' onclick="pushButton(this.value);"></td>
</tr>
<tr>
<td><input class="calc" type="button" value=4 onclick="pushButton(this.value);"></td>
<td><input class="calc" type="button" value=5 onclick="pushButton(this.value);"></td>
<td><input class="calc" type="button" value=6 onclick="pushButton(this.value);"></td>
<td><input class="calc" type="button" value='*' onclick="pushButton(this.value);"></td>
</tr>
<tr>
<td><input class="calc" type="button" value=7 onclick="pushButton(this.value);"></td>
<td><input class="calc" type="button" value=8 onclick="pushButton(this.value);"></td>
<td><input class="calc" type="button" value=9 onclick="pushButton(this.value);"></td>
<td><input class="calc" type="button" value='-' onclick="pushButton(this.value);"></td>
</tr>
<tr>
<td><input class="calc" type="button" value=0 onclick="pushButton(this.value);"></td>
<td><input class="calc" type="button" value='.' onclick="pushButton(this.value);"></td>
<td><input class="calc" type="button" value='C' onclick="pushButton(this.value);"></td>
<td><input class="calc" type="button" value='+' onclick="pushButton(this.value);"></td>
</tr>
<tr><td colspan=3><input class="calc" type="button" value='=' onclick="calculate(document.getElementById('screen').value);"></td></tr>
</table>
</body>
</html>
No comments:
Post a Comment