您的位置：首页 > Web前端 > JavaScript

html+js实现四则元算计算器

2015-10-18 16:45 274 查看
计算器

四则运算计算器

// function compute(obj){
obj.expr.value=eval(obj.expr.value);
}
var one="1",two="2",three="3",four="4",five="5",six="6",seven="7",eigth="8",nine="9";
var zero="0",plus="+",minus="-",multiply="*",divide="/",decimal=".";
function enter(obj,string){
obj.expr.value+=string;

}
function clear(obj){
obj.expr.value= "";

}
// ]]>

<!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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>计算器</title>
<h1>四则运算计算器</h1><hr />

</head>

<body>

<form name="calc">
<table border="1" bgcolor="#c0c0c0">
<tr>
<td colspan=4>
<input type="text" name="expr" size=30 action="compute(this.form)" />
</td>
</tr>
<tr>
<td align="center">
<input type="button" id="button"value="1" onclick="enter(this.form,one)" style="		 						border-style:double;border-width:3px" />
</td>
<td align="center">
<input type="button" id="button" value="2" onclick="enter(this.form,two)" style="	 				border-style:double;border-width:3px" />
</td>
<td align="center">
<input type="button" id="button"value="3" onclick="enter(this.form,three)"
style="border-style:double;border-width:3px" />
</td>
<td align="center">
<input type="button" id="button"
value="+" onclick="enter(this.form,plus)" style="border-style:double;border-width:3px" 			/>
</td>
</tr>
<tr>
<td align="center">
<input type="button" id="button"
value="4" onclick="enter(this.form,four)" style="border-style:double;border-width:3px" 			/>
</td>
<td align="center">
<input type="button" id="button"
value="5" onclick="enter(this.form,five)" style="border-style:double;border-width:	           3px" />
</td>
<td align="center">
<input type="button" id="button"
value="6" onclick="enter(this.form,six)" style="border-style:double;border-width:3px" 			/>
</td>
<td align="center">
<input type="button" id="button"
value="-" onclick="enter(this.form,minus)" style="border-style:double;border-width:3px" />
</td>
</tr>
<tr>
<td align="center"><input type="button" id="button"
value="7" onclick="enter(this.form,seven)" style="border-style:double;border-width:3px" />
</td>
<td align="center"><input type="button" id="button"
value="8" onclick="enter(this.form,eigth)" style="border-style:double;border-width:3px" />
</td>
<td align="center"><input type="button" id="button"
value="9" onclick="enter(this.form,nine)" style="border-style:double;border-width:3px" />
</td>
<td align="center"><input type="button" id="button"
value="*" onclick="enter(this.form,multiply)" style="border-style:double;border-width:3px" />
</td>
</tr>
<tr>
<td colspan=2 align="center"><input type="button" id="button"
value="      0      " onclick="enter(this.form,zero)" style="border-style:double;border-width:3px" />
</td>
<td align="center"><input type="button" id="button"
value="." onclick="enter(this.form,decimal)" style="border-style:double;border-width:3px" />
</td>
<td align="center"><input type="button" id="button"
value="/" onclick="enter(this.form,divide)" style="border-style:double;border-width:3px" />
</td>
</tr>
<tr>
<td colspan=2 align="center"><input type="button" id="button"
value="   =   " onclick="compute(this.form)"/>
</td>
<td colspan=2 align="center">
<input type="button"
value="AC" size=10  onClick="clear(this.form)"  />
</td>

</tr>
</table>

</form>
</body>
</html>


<script type="text/javascript">
function compute(obj){
obj.expr.value=eval(obj.expr.value);
}
var one="1",two="2",three="3",four="4",five="5",six="6",seven="7",eigth="8",nine="9";
var zero="0",plus="+",minus="-",multiply="*",divide="/",decimal=".";
function enter(obj,string){
obj.expr.value+=string;

}
function clear(obj){
obj.expr.value= "";

}

</script>


内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息
标签： 
相关文章推荐
新的分享
章节导航