javascript制作简易计算器

来源:互联网 发布:yeahmobi java 编辑:程序博客网 时间:2024/04/28 09:59
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript">
var flag = true;
function getNum(num){
if(!flag){
document.getElementById('res').value = '';
flag = true;
}
document.getElementById('res').value += num;
}
function getRes(){
var num = document.getElementById('res').value;
num = eval(num);
document.getElementById('res').value = num;
flag = false;
}
</script>
</head>


<body>
<TABLE border="1px" width="300px">
<caption>简易计算器</caption>
<TR>
<TD colspan="4"><input type="text" id="res" size="44"/></TD>
</TR>
<TR>
<TD><input type="button" value="1" style="width:75px" onclick="getNum(1)"/></TD>
<TD><input type="button" value="2" style="width:75px" onclick="getNum(2)"/></TD>
<TD><input type="button" value="3" style="width:75px" onclick="getNum(3)"/></TD>
<TD><input type="button" value="+" style="width:75px" onclick="getNum('+')"/></TD>
</TR>
<TR>
<TD><input type="button" value="4" style="width:75px" onclick="getNum(4)"/></TD>
<TD><input type="button" value="5" style="width:75px" onclick="getNum(5)"/></TD>
<TD><input type="button" value="6" style="width:75px" onclick="getNum(6)"/></TD>
<TD><input type="button" value="-" style="width:75px" onclick="getNum('-')"/></TD>
</TR>
<TR>
<TD><input type="button" value="7" style="width:75px" onclick="getNum(7)"/></TD>
<TD><input type="button" value="8" style="width:75px" onclick="getNum(8)"/></TD>
<TD><input type="button" value="9" style="width:75px" onclick="getNum(9)"/></TD>
<TD><input type="button" value="*" style="width:75px" onclick="getNum('*')"/></TD>
</TR>
<TR>
<TD><input type="button" value="0" style="width:75px" onclick="getNum(0)"/></TD>
<TD><input type="button" value="." style="width:75px" onclick="getNum('.')"/></TD>
<TD><input type="button" value="=" style="width:75px" onclick="getRes()"/></TD>
<TD><input type="button" value="/" style="width:75px" onclick="getNum('/')"/></TD>
</TR>
</TABLE>
</body>


</html>
原创粉丝点击