In: Computer Science
Create a form in which the user enters two separate numbers (x and y), and when the user clicks the appropriate button, math functions are performed on these two numbers and output back on to the form.
INPUT
PROCESSING
OUTPUT
CRITERIA
GRADING
SUBMISSION INSTRUCTIONS
All files should be included in submission
<html>
<head>
<title>Math
Operations</title>
<script>
function
calc(){
var x = parseInt(document.maths.x.value);
var y = parseInt(document.maths.y.value);
document.getElementById("output").innerHTML =
"Addition="+(x+y)+"<br>Subtraction="+(x-y)+"<br>Multiplication="+(x*y)+"<br>Division="+(x/y)+"<br>";
console.log(document.maths.x.value);
}
function
reset(){
document.maths.x.value = null;
document.maths.y.value = null;
document.getElementById("output").innerHTML =
"";
}
</script>
</head>
<body>
<div style="text-align: center
!important;">
<br>
<h2>
CALCULATOR </h2>
<hr><br>
<form name="maths">
X: <input
style="margin: 5px;" type="number" name="x" id="x"
placeholder="Enter value of x"><br>
Y: <input
style="margin: 5px;"type="number" name="y" id="y"
placeholder="Enter value of y">
</form>
<button style="margin: 5px;
height:30px; width: 100px; background: green; color: white;"
onclick="calc()">Calculate</button>
<button style="margin: 5px;
height:30px; width: 100px; background: red; color: white;"
onclick="reset()">Reset</button>
<p
id="output"></p>
</div>
</body>
</html>