计算器的实现
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
div {
width: 200px;
height: 280px;
border: solid 1px red;
margin: 50px auto;
text-align: center;
}
input[type=button] {
width: 40px;
height: 35px;
}
</style>
</head>
<body>
<br>
<br>
<div>
<br>
<input type="text" id="input1">
<br>
<br>
<input type="button" value="1" onclick="clickBtn(this.value)">
<input type="button" value="2" onclick="clickBtn(this.value)">
<input type="button" value="3" onclick="clickBtn(this.value)">
<input type="button" value="+" onclick="clickBtn(this.value)">
<br>
<br>
<input type="button" value="4" onclick="clickBtn(this.value)">
<input type="button" value="5" onclick="clickBtn(this.value)">
<input type="button" value="6" onclick="clickBtn(this.value)">
<input type="button" value="-" onclick="clickBtn(this.value)">
<br>
<br>
<input type="button" value="7" onclick="clickBtn(this.value)">
<input type="button" value="8" onclick="clickBtn(this.value)">
<input type="button" value="9" onclick="clickBtn(this.value)">
<input type="button" value="*" onclick="clickBtn(this.value)">
<br>
<br>
<input type="button" value="C" onclick="clickBtn(this.value)">
<input type="button" value="0" onclick="clickBtn(this.value)">
<input type="button" value="=" onclick="clickBtn(this.value)">
<input type="button" value="/" onclick="clickBtn(this.value)">
<br>
</div>
<script>
var result = document.getElementById("input1");
function clickBtn(val) {
switch(val){
case "C":
result.value = 0;
break;
case "=":
result.value = eval(result.value);
break;
default:
result.value += val;
break;
}
}
</script>
</body>
</html>