实现了最基本的计算功能
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>calculate</title>
<script language="javascript" type="text/javascript">
// <![CDATA[
//原理: 点击数字按钮和符号生成类似"12+3-9*7/3"这样的表达式 然后调用eval函数计算出来
//点击数字按钮和符号按钮
function NumClick(num) {
Cal.show.value += event.srcElement.name; //event.srcElement仅支持IE
}
//清屏
function ClearScreen() {
Cal.show.value = "";
}
//计算
function Result() {
Cal.show.value = eval(Cal.show.value);
}
//退格
function DelClick() {
Cal.show.value = Cal.show.value.substring(0, Cal.show.value.length - 1);
}
// ]]>
</script>
</head>
<body>
<form name="Cal">
<table border="1">
<tr>
<td>
<input name="show" type="text" size="12" />
<input id="del" type="button" value="Del" onclick="DelClick()" />
</td>
</tr>
<tr>
<td>
<table border="2">
<tr>
<td>
<input name="1" type="button" value="1" onclick="NumClick()" />
</td>
<td>
<input name="2" type="button" value="2" onclick="NumClick()" />
</td>
<td>
<input name="3" type="button" value="3" onclick="NumClick()" />
</td>
<td>
<input name="+" type="button" value="+" onclick="NumClick()" />
</td>
</tr>
<tr>
<td>
<input name="4" type="button" value="4" onclick="NumClick()" />
</td>
<td>
<input name="5" type="button" value="5" onclick="NumClick()" />
</td>
<td>
<input name="6" type="button" value="6" onclick="NumClick()" />
</td>
<td>
<input name="-" type="button" value="-" onclick="NumClick()" />
</td>
</tr>
<tr>
<td>
<input name="7" type="button" value="7" onclick="NumClick()" />
</td>
<td>
<input name="8" type="button" value="8" onclick="NumClick()" />
</td>
<td>
<input name="9" type="button" value="9" onclick="NumClick()" />
</td>
<td>
<input name="*" type="button" value="*" onclick="NumClick()" />
</td>
</tr>
<tr>
<td>
<input name="C" type="button" value="C" onclick="ClearScreen()" />
</td>
<td>
<input name="0" type="button" value="0" onclick="NumClick()" />
</td>
<td>
<input name="=" type="button" value="=" onclick="Result()" />
</td>
<td>
<input name="/" type="button" value="/" onclick="NumClick()" />
</td>
</tr>
</table>
</td>
</tr>
</table>
</form>
</body>
</html>