<!DOCTYPE html>
<html>
<head>
<title>简单计算器</title>
<style>
.container {
width: 200px;
padding: 10px;
border: 1px solid #ccc;
margin: 0 auto;
}
input[type="button"] {
width: 50px;
height: 30px;
}
</style>
</head>
<body>
<div class="container">
<input type="text" id="result" readonly>
<br>
<input type="button" value="1" οnclick="updateDisplay('1')">
<input type="button" value="2" οnclick="updateDisplay('2')">
<input type="button" value="3" οnclick="updateDisplay('3')">
<input type="button" value="+" οnclick="updateDisplay('+')">
<br>
<input type="button" value="4" οnclick="updateDisplay('4')">
<input type="button" value="5" οnclick="updateDisplay('5')">
<input type="button" value="6" οnclick="updateDisplay('6')">
<input type="button" value="-" οnclick="updateDisplay('-')">
<br>
<input type="button" value="7" οnclick="updateDisplay('7')">
<input type="button" value="8" οnclick="updateDisplay('8')">
<input type="button" value="9" οnclick="updateDisplay('9')">
<input type="button" value="*" οnclick="updateDisplay('*')">
<br>
<input type="button" value="0" οnclick="updateDisplay('0')">
<input type="button" value="." οnclick="updateDisplay('.')">
<input type="button" value="=" οnclick="calculate()">
<input type="button" value="/" οnclick="updateDisplay('/')">
<br>
<input type="button" value="清空" οnclick="clearDisplay()">
</div>
<script>
function updateDisplay(value) {
document.getElementById('result').value += value;
}
function clearDisplay() {
document.getElementById('result').value = '';
}
function calculate() {
var expression = document.getElementById('result').value;
var result = eval(expression);
document.getElementById('result').value = result;
}
</script>
</body>
</html>
2054
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
