用java script写个计算器
时间: 2023-12-24 15:03:11 浏览: 66
好的,下面是一个简单的JavaScript计算器示例:
```html
<!DOCTYPE html>
<html>
<head>
<title>计算器</title>
<style type="text/css">
input[type="button"]{
background-color: #4CAF50;
color: white;
border: none;
padding: 10px 20px;
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 16px;
margin: 4px 2px;
cursor: pointer;
}
input[type="text"]{
padding: 10px 20px;
font-size: 16px;
margin: 4px 2px;
}
</style>
</head>
<body>
<div>
<input type="text" id="result" readonly>
</div>
<div>
<input type="button" value="1" onclick="addToInput('1')">
<input type="button" value="2" onclick="addToInput('2')">
<input type="button" value="3" onclick="addToInput('3')">
<input type="button" value="+" onclick="addToInput('+')">
</div>
<div>
<input type="button" value="4" onclick="addToInput('4')">
<input type="button" value="5" onclick="addToInput('5')">
<input type="button" value="6" onclick="addToInput('6')">
<input type="button" value="-" onclick="addToInput('-')">
</div>
<div>
<input type="button" value="7" onclick="addToInput('7')">
<input type="button" value="8" onclick="addToInput('8')">
<input type="button" value="9" onclick="addToInput('9')">
<input type="button" value="*" onclick="addToInput('*')">
</div>
<div>
<input type="button" value="0" onclick="addToInput('0')">
<input type="button" value="." onclick="addToInput('.')">
<input type="button" value="=" onclick="calculate()">
<input type="button" value="/" onclick="addToInput('/')">
</div>
<script type="text/javascript">
function addToInput(val) {
document.getElementById("result").value += val;
}
function calculate() {
var inputVal = document.getElementById("result").value;
if (inputVal == "") {
alert("请输入一个数值!");
return;
}
var result = eval(inputVal);
document.getElementById("result").value = result;
}
</script>
</body>
</html>
```
这个计算器只支持简单的加减乘除运算,你可以根据自己的需求进行扩展。
阅读全文