-
Notifications
You must be signed in to change notification settings - Fork 2
Expand file tree
/
Copy pathInputCalculator.html
More file actions
69 lines (63 loc) · 1.74 KB
/
InputCalculator.html
File metadata and controls
69 lines (63 loc) · 1.74 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Calculator using Input</title>
</head>
<body>
<h1>Simple Calculator using Input</h1>
<div>
<label for="num1">Enter number 1 : </label>
<input type="number" id="num1" />
</div>
<div>
<label for="num2">Enter number 2 : </label>
<input type="number" id="num2" />
</div>
<div>
<label for="operator">Select Operator : </label>
<select id="operator">
<option value="+">Addition (+)</option>
<option value="-">Subtraction (-)</option>
<option value="*">Multiplication (*)</option>
<option value="/">Division (/)</option>
</select>
</div>
<button id="calculate">Calculate</button>
<div id="result"></div>
<script>
const num1Input = document.getElementById("num1")
const num2Input = document.getElementById("num2")
const operatorSelect = document.getElementById("operator")
const calculateButton = document.getElementById("calculate")
const resultDiv = document.getElementById("result")
calculateButton.addEventListener("click", function () {
const num1 = parseFloat(num1Input.value)
const num2 = parseFloat(num2Input.value)
const operator = operatorSelect.value
let result
switch (operator) {
case "+":
result = num1 + num2
break
case "-":
result = num1 - num2
break
case "*":
result = num1 / num2
break
case "/":
if (num2 === 0) {
result = "Division by zero is now allowed"
} else {
result = num1 / num2
}
default:
result = "Invalid operator"
}
resultDiv.textContent = `Result : ${result}`
})
</script>
</body>
</html>