Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly
Sign up
Appearance settings

Commit 31973d6

Browse files
Merge pull request #1179 from yashpokharna2555/calculator-add-validation
Add the validation for 0 and '+' operator
2 parents 27fc4a1 + 188c3fd commit 31973d6

File tree

3 files changed

+125
-0
lines changed

3 files changed

+125
-0
lines changed

‎Calculator/yash_pokharna/index.html‎

Lines changed: 35 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,35 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8">
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
6+
<title>Calculator</title>
7+
<link rel="stylesheet" href="styles.css">
8+
</head>
9+
<body>
10+
<div class="calculator">
11+
<input type="text" id="display" readonly>
12+
<div class="buttons">
13+
<button onclick="clearDisplay()">C</button>
14+
<button onclick="addOperator('/')">/</button>
15+
<button onclick="addOperator('*')">*</button>
16+
<button onclick="deleteLast()">DEL</button><br>
17+
<button onclick="appendNumber('7')">7</button>
18+
<button onclick="appendNumber('8')">8</button>
19+
<button onclick="appendNumber('9')">9</button>
20+
<button onclick="addOperator('-')">-</button><br>
21+
<button onclick="appendNumber('4')">4</button>
22+
<button onclick="appendNumber('5')">5</button>
23+
<button onclick="appendNumber('6')">6</button>
24+
<button onclick="addOperator('+')">+</button><br>
25+
<button onclick="appendNumber('1')">1</button>
26+
<button onclick="appendNumber('2')">2</button>
27+
<button onclick="appendNumber('3')">3</button>
28+
<button onclick="calculate()">=</button><br>
29+
<button onclick="appendNumber('0')">0</button>
30+
<button onclick="appendNumber('.')">.</button>
31+
</div>
32+
</div>
33+
<script src="script.js"></script>
34+
</body>
35+
</html>

‎Calculator/yash_pokharna/script.js‎

Lines changed: 38 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,38 @@
1+
let display = document.getElementById("display");
2+
3+
function clearDisplay() {
4+
display.value = "";
5+
}
6+
7+
function deleteLast() {
8+
display.value = display.value.slice(0, -1);
9+
}
10+
11+
function appendNumber(number) {
12+
if (number === '.' && display.value.includes('.') && !isNaN(display.value.slice(-1))) {
13+
alert("Error: Multiple decimal points are not allowed.");
14+
return;
15+
}
16+
display.value += number;
17+
}
18+
19+
function addOperator(operator) {
20+
const lastChar = display.value.slice(-1);
21+
if (!display.value || isNaN(lastChar)) {
22+
alert("Error: Cannot add consecutive operators.");
23+
return;
24+
}
25+
display.value += operator;
26+
}
27+
28+
function calculate() {
29+
try {
30+
if (display.value.includes("/0")) {
31+
alert("Error: Division by zero is undefined.");
32+
return;
33+
}
34+
display.value = eval(display.value);
35+
} catch (error) {
36+
alert("Error: Invalid operation.");
37+
}
38+
}

‎Calculator/yash_pokharna/style.css‎

Lines changed: 52 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,52 @@
1+
body {
2+
font-family: Arial, sans-serif;
3+
display: flex;
4+
justify-content: center;
5+
align-items: center;
6+
height: 100vh;
7+
margin: 0;
8+
background-color: #f5f5f5;
9+
}
10+
11+
.calculator {
12+
background: #fff;
13+
padding: 20px;
14+
border-radius: 10px;
15+
box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
16+
}
17+
18+
#display {
19+
width: 100%;
20+
height: 50px;
21+
font-size: 18px;
22+
margin-bottom: 10px;
23+
text-align: right;
24+
padding: 5px;
25+
border: 1px solid #ccc;
26+
border-radius: 5px;
27+
background: #f9f9f9;
28+
}
29+
30+
.buttons {
31+
display: grid;
32+
grid-template-columns: repeat(4, 1fr);
33+
gap: 10px;
34+
}
35+
36+
button {
37+
height: 50px;
38+
font-size: 18px;
39+
border: none;
40+
border-radius: 5px;
41+
cursor: pointer;
42+
background: #007BFF;
43+
color: white;
44+
}
45+
46+
button:hover {
47+
background: #0056b3;
48+
}
49+
50+
button:active {
51+
background: #003f7f;
52+
}

0 commit comments

Comments
(0)

AltStyle によって変換されたページ (->オリジナル) /