简单的计算器——只能实现一步表达式
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>简单计算器</title>
<script type="text/javascript">
var s = "";
// 清零函数
function QL() {
document.calc.result.value = "";
s = "";
}
//显示屏幕函数
function fun(i) {
var k = document.getElementsByName("num")[i].value;
s = s + k;
document.calc.result.value = s;
}
// 计算函数
function calculate() {
var re = eval(s);
document.calc.result.value = re;
s = "";
}
</script>
</head>
<body>
<form name="calc">
<!-- //构造计算器布局表格 -->
<table border=1 width=180>
<!-- //计算器第一行输出 -->
<tr>
<td colspan=2 width="50%"><INPUT TYPE="text" name="result"
style="width: 120px;"></td>
</tr>
<!-- //计算器第二行"123+" -->
<tr align="center" valign="middle">
<td width="25%"><INPUT type="button" name="num"
onclick="fun(0)" value="1" style="width: 60px;" /></td>
<td width="25%"><INPUT type="button" name="num"
onclick="fun(1)" value="2" style="width: 60px;" /></td>
<td width="25%"><INPUT type="button" name="num"
onclick="fun(2)" value="3" style="width: 60px;" /></td>
<td width="25%"><INPUT type="button" name="num"
onclick="fun(3)" value="+" style="width: 60px;" /></td>
</tr>
<!-- //计算器第三行"456-" -->
<tr align="center" valign="middle">
<td width="25%"><INPUT type="button" name="num"
onclick="fun(4)" value="4" style="width: 60px;"></td>
<td width="25%"><INPUT type="button" name="num"
onclick="fun(5)" value="5" style="width: 60px;"></td>
<td width="25%"><INPUT type="button" name="num"
onclick="fun(6)" value="6" style="width: 60px;"></td>
<td width="25%"><INPUT type="button" name="num"
onclick="fun(7)" value="-" style="width: 60px;"></td>
</tr>
<!-- //计算器第四行"789*" -->
<tr align="center" valign="middle">
<td width="25%"><INPUT type="button" name="num"
onclick="fun(8)" value="7" style="width: 60px;"></td>
<td width="25%"><INPUT type="button" name="num"
onclick="fun(9)" value="8" style="width: 60px;"></td>
<td width="25%"><INPUT type="button" name="num"
onclick="fun(10)" value="9" style="width: 60px;"></td>
<td width="25%"><INPUT type="button" name="num"
onclick="fun(11)" value="*" style="width: 60px;"></td>
</tr>
<!-- //计算器第五行".0=/" -->
<tr align="center" valign="middle">
<td width="25%"><INPUT type="button" name="rezero" id="zero"
onclick="QL()" value="C" style="width: 60px;"></td>
<td width="25%"><INPUT type="button" name="num"
onclick="fun(12)" value="0" style="width: 60px;"></td>
<td width="25%"><INPUT type="button" name="equal"
onclick="calculate()" value="=" style="width: 60px;"></td>
<td width="25%"><INPUT type="button" name="num"
onclick="fun(13)" value="/" style="width: 60px;"></td>
</tr>
</table>
</form>
</body>
</html>