用html和js制作简单计算器点击其中两个如果第一位是0则直接省略
时间: 2024-10-12 11:10:56 浏览: 10
在HTML和JavaScript中制作一个简单的计算器,你可以创建一个包含数字按钮、运算符按钮以及清除按钮的界面。当你点击两个数字按钮时,可以动态地将它们添加到输入框中。对于数字0,如果你希望它不会出现在结果之前,可以在用户点击时检查当前是否已经有非零数,如果没有,则不添加0。
下面是一个简单的示例:
```html
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<title>简单计算器</title>
</head>
<body>
<input type="text" id="calculator-input" disabled>
<div id="buttons">
<!-- 数字按钮 -->
<button onclick="addNumber(0)">0</button>
<!-- ...其他数字按钮... -->
<!-- 运算符按钮 -->
<button onclick="calculate()">=</button>
<!-- ...其他运算符按钮... -->
<!-- 清除按钮 -->
<button onclick="clearInput()">C</button>
</div>
<script>
let input = document.getElementById('calculator-input');
let currentNum = '';
function addNumber(num) {
if (currentNum === '0' || !currentNum) return; // 如果已有0或者无数字,则忽略
input.value += num;
currentNum = num;
}
function clearInput() {
input.value = '';
currentNum = '';
}
</script>
</body>
</html>
```
在这个例子中,`addNumber`函数会在每次点击数字按钮时检查`currentNum`,如果不是0或者为空,就将数字添加到输入框。这样,当用户首次点击0时,不会显示在输入框中。
阅读全文