how to create calculator in html
<!DOCTYPE html>
<html>
<head>
<title>Simple Calculator</title>
<style>
input[type="text"] {
width: 200px;
}
</style>
</head>
<body>
<h1>Simple Calculator</h1>
<input type="text" id="result" disabled>
<br>
<button onclick="appendToResult('7')">7</button>
<button onclick="appendToResult('8')">8</button>
<button onclick="appendToResult('9')">9</button>
<button onclick="clearResult()">C</button>
<br>
<button onclick="appendToResult('4')">4</button>
<button onclick="appendToResult('5')">5</button>
<button onclick="appendToResult('6')">6</button>
<button onclick="appendToResult('+')">+</button>
<br>
<button onclick="appendToResult('1')">1</button>
<button onclick="appendToResult('2')">2</button>
<button onclick="appendToResult('3')">3</button>
<button onclick="appendToResult('-')">-</button>
<br>
<button onclick="appendToResult('0')">0</button>
<button onclick="appendToResult('.')">.</button>
<button onclick="calculateResult()">=</button>
<button onclick="appendToResult('*')">*</button>
<br>
<button onclick="appendToResult('/')">/</button>
</body>
<script>
function appendToResult(value) {
document.getElementById("result").value += value;
}
function clearResult() {
document.getElementById("result").value = "";
}
function calculateResult() {
try {
document.getElementById("result").value = eval(document.getElementById("result").value);
} catch (e) {
document.getElementById("result").value = "Error";
}
}
</script>
</html>
Simple Calculator
<html>
<head>
<title>Simple Calculator</title>
<style>
input[type="text"] {
width: 200px;
}
</style>
</head>
<body>
<h1>Simple Calculator</h1>
<input type="text" id="result" disabled>
<br>
<button onclick="appendToResult('7')">7</button>
<button onclick="appendToResult('8')">8</button>
<button onclick="appendToResult('9')">9</button>
<button onclick="clearResult()">C</button>
<br>
<button onclick="appendToResult('4')">4</button>
<button onclick="appendToResult('5')">5</button>
<button onclick="appendToResult('6')">6</button>
<button onclick="appendToResult('+')">+</button>
<br>
<button onclick="appendToResult('1')">1</button>
<button onclick="appendToResult('2')">2</button>
<button onclick="appendToResult('3')">3</button>
<button onclick="appendToResult('-')">-</button>
<br>
<button onclick="appendToResult('0')">0</button>
<button onclick="appendToResult('.')">.</button>
<button onclick="calculateResult()">=</button>
<button onclick="appendToResult('*')">*</button>
<br>
<button onclick="appendToResult('/')">/</button>
</body>
<script>
function appendToResult(value) {
document.getElementById("result").value += value;
}
function clearResult() {
document.getElementById("result").value = "";
}
function calculateResult() {
try {
document.getElementById("result").value = eval(document.getElementById("result").value);
} catch (e) {
document.getElementById("result").value = "Error";
}
}
</script>
</html>
कोई टिप्पणी नहीं