Build A Simple Calculator Using HTML Form Elements And JavaScript

belongs to collection: HTML + Javascript Examples

YasminRadwan26

Save to bookmark

2022-06-01

340

Build a Calculator using HTML form elements and JavaScript.

Html programming, JavaScript programming, examples, Html programming examples, JavaScript programming examples,

All Answers

YasminRadwan26

2022-06-01

need an explanation for this answer? contact us directly to get an explanation for this answer

<html>
<head></head>
<body align="center" bgcolor="aqua">
<h3>Simple Calculator</h3>
<br/>
<form Name="calc" >
<table border="10" cellpadding="5" cellspacing="5" align="center" height="200" width="400">
<tr>
<td colspan=4><input type=text Name="display"></td>
</tr>
<tr>
<td><input type=button height="20" width="20" value="1" OnClick="calc.display.value+='1'"></td>
<td><input type=button value="2" OnClick="calc.display.value+='2'"></td>
<td><input type=button value="3" OnClick="calc.display.value+='3'"></td>
<td><input type=button value="+" OnClick="calc.display.value+='+'"></td>
</tr>
<tr>

<td><input type=button value="4" OnClick="calc.display.value+='4'"></td>
<td><input type=button value="5" OnClick="calc.display.value+='5'"></td>
<td><input type=button value="6" OnClick="calc.display.value+='6'"></td>
<td><input type=button value="-" OnClick="calc.display.value+='-'"></td>
</tr>
<tr>
<td><input type=button value="7" OnClick="calc.display.value+='7'"></td>
<td><input type=button value="8" OnClick="calc.display.value+='8'"></td>
<td><input type=button value="9" OnClick="calc.display.value+='9'"></td>
<td><input type=button value="x" OnClick="calc.display.value+='*'"></td>
</tr>
<tr>
<td><input type=button value="0" OnClick="calc.display.value+='0'"></td>
<td><input type=button value="C" OnClick="calc.display.value=''"></td>
<td><input type=button value="=" OnClick="calc.display.value=eval(calc.display.value)"></td>
<td><input type=button value="/" OnClick="calc.display.value+='/'"></td>
</tr>
</table>
</form>
</body>
</html>

Output: