用javascript写一个计算器,要有清零功能
时间: 2024-05-05 10:17:38 浏览: 90
用javascript写的一个计算器
好的,这是一个很常见的计算器功能,以下是一个简单的带有清零功能的javascript计算器代码示例:
HTML 代码:
```html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>简单计算器</title>
</head>
<body>
<h1>简单计算器</h1>
<input type="text" id="output" readonly>
<br>
<button onclick="clearOutput()">清零</button>
<br>
<button onclick="addToOutput('1')">1</button>
<button onclick="addToOutput('2')">2</button>
<button onclick="addToOutput('3')">3</button>
<button onclick="addToOutput('+')">+</button>
<br>
<button onclick="addToOutput('4')">4</button>
<button onclick="addToOutput('5')">5</button>
<button onclick="addToOutput('6')">6</button>
<button onclick="addToOutput('-')">-</button>
<br>
<button onclick="addToOutput('7')">7</button>
<button onclick="addToOutput('8')">8</button>
<button onclick="addToOutput('9')">9</button>
<button onclick="addToOutput('*')">*</button>
<br>
<button onclick="addToOutput('0')">0</button>
<button onclick="addToOutput('.')">.</button>
<button onclick="calculateResult()">=</button>
<button onclick="addToOutput('/')">/</button>
</body>
</html>
```
Javascript 代码:
```javascript
var output = document.getElementById("output");
function addToOutput(value) {
output.value += value;
}
function clearOutput() {
output.value = "";
}
function calculateResult() {
output.value = eval(output.value);
}
```
这段代码创建了一个简单的HTML页面,其中有一个只读的文本框和一些按钮。每个按钮都有一个onclick属性,指定当按钮被点击时要执行的javascript函数。这些函数可以很容易地扩展以添加更多运算符和数字。
阅读全文