caculator.html
<!DOCTYPE html>
<html>
<head>
<title>簡單的計算器</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
<meta name="pragma" content="no-cache">
<meta name="cache-control" content="no-cache">
<meta name="expires" content="0">
<meta name="keywords" content="數字遊戲">
<meta name="description" content="This is a number_game">
<script type="text/javascript" src="func.js"></script>
<link href="style.css" rel="stylesheet" type="text/css">
</head>
<body>
<center>
<form name="my_form" id="my_form" >
<table id="my_table" border="1" >
<tr>
<td colspan="4"><input type="text" size="40" name="result"></td>
</tr>
<tr>
<td><input type="button" value="AC" id="button" onclick="clearReset(this.form)"></td>
<td><input type="button" value="+/-" onclick="enter(this.form,character)"></td>
<td><input type="button" value="%" onclick="enter(this.form,percent)"></td>
<td><input type="button" value="/" onclick="enter(this.form,divide)"></td>
</tr>
<tr>
<td><input type="button" value="7" onclick="enter(this.form,seven)"></td>
<td><input type="button" value="8" onclick="enter(this.form,eight)"></td>
<td><input type="button" value="9" onclick="enter(this.form,nine)"></td>
<td><input type="button" value="*" onclick="enter(this.form,multiply)"></td>
</tr>
<tr>
<td><input type="button" value="4" onclick="enter(this.form,four)"></td>
<td><input type="button" value="5" onclick="enter(this.form,five)"></td>
<td><input type="button" value="6" onclick="enter(this.form,six)"></td>
<td><input type="button" value="-" onclick="enter(this.form,minus)"></td>
</tr>
<tr>
<td><input type="button" value="1" onclick="enter(this.form,one)"></td>
<td><input type="button" value="2" onclick="enter(this.form,two)"></td>
<td><input type="button" value="3" onclick="enter(this.form,three)"></td>
<td><input type="button" value="+" onclick="enter(this.form,plus)"></td>
</tr>
<tr>
<td colspan="2"><input type="button" value="0" onclick="enter(this.form,zero)"></td>
<td><input type="button" value="." onclick="enter(this.form,decimal)"></td>
<td><input type="button" value="=" onclick="compute(this.form)"></td>
</tr>
</table>
</form>
</center>
</body>
</html>
style.css
#my_table
{
text-align: center;
border-style: none;
}
func.js
var one='1' ,two='2' ,three='3' ,four='4' ;
var five='5' ,six='6' ,seven='7' ,eight='8' ;
var nine='9' ,zero='0' ;
var plus='+' ,minus='-',multiply='*' ,divide='/' ,decimal='.' ,percent='%' ,character='-';
function clearReset(obj)
{
obj.result.value=" ";
}
function enter(obj,String)
{
obj.result.value+=String;
}
function compute(obj)
{
obj.result.value=eval( obj.result.value);
}
