用JS写的简单的计算器实现代码

时间:2020-05-12 人气:0

1.本页效果图片

2.美化后的效果

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> 
<html> 
<head> 
<script> 
Array.prototype.remove=function(index) 
{ 
if(isNaN(index)||index>this.length){return false;} 
for(var i=0,n=0;i<this.length;i++) 
{ 
if(this[i]!=this[index]) 
{ 
this[n++]=this[i] 
} 
} 
this.length-=1 
}

this.showmsg(this.register.join(' ')); 
var _exp = parseInt(eval(this.register.join(' '))); 
this.output.value = _exp; 
for(i=0;i<3;i++){ 
this.register.remove(i); 
} 
this.register[0] = _exp; 
this.tmp = ''; 
if(type) this.register[1] = this.method; 
return; 
} 
} 
var commonMath = new commonMath(); 
commonMath.init(); 
</script> 
<style> 
#main{ 
width:100%; 
height:100%; 
} 
#inputs{ 
position:relative; 
top:50%; 
left:50%; 
} 
.inbutton{ 
width:30px; 
} 
.outbutton{ 
width:145px; 
text-align:right; 
} 
.tcenter{ 
text-align:center; 
} 
</style> 
</head> 
<body> 
<div> 
<div> 
<span class="outbutton tcenter">etongchina@gmail.com</span> 
</div> 
<div> 
<span><input id="output" type="text" class="outbutton" maxlength="9" value="." /></span> 
</div> 
<div> 
<span><input type="button" class="inbutton" value="7" onclick="commonMath.getValue(this.value)" /></span> 
<span><input type="button" class="inbutton" value="8" onclick="commonMath.getValue(this.value)" /></span> 
<span><input type="button" class="inbutton" value="9" onclick="commonMath.getValue(this.value)" /></span> 
<span><input type="button" class="inbutton" value="+" onclick="commonMath.getValue(this.value)" /></span> 
</div> 
<div> 
<span><input type="button" class="inbutton" value="4" onclick="commonMath.getValue(this.value);" /></span> 
<span><input type="button" class="inbutton" value="5" onclick="commonMath.getValue(this.value);" /></span> 
<span><input type="button" class="inbutton" value="6" onclick="commonMath.getValue(this.value);" /></span> 
<span><input type="button" class="inbutton" value="-" onclick="commonMath.getValue(this.value);" /></span> 
</div> 
<div> 
<span><input type="button" class="inbutton" value="1" onclick="commonMath.getValue(this.value);" /></span> 
<span><input type="button" class="inbutton" value="2" onclick="commonMath.getValue(this.value);" /></span> 
<span><input type="button" class="inbutton" value="3" onclick="commonMath.getValue(this.value);" /></span> 
<span><input type="button" class="inbutton" value="*" onclick="commonMath.getValue(this.value);" /></span> 
</div> 
<div> 
<span><input type="button" class="inbutton" value="0" onclick="commonMath.getValue(this.value);" /></span> 
<span><input type="button" class="inbutton" value="+/-" onclick="commonMath.getValue(this.value);" /></span> 
<span><input type="button" class="inbutton" value="." onclick="commonMath.getValue(this.value);" /></span> 
<span><input type="button" class="inbutton" value="/" onclick="commonMath.getValue(this.value);" /></span> 
</div> 
<div> 
<span><input type="button" class="outbutton tcenter" value="计算" onclick="commonMath.getValue('=');" /></span> 
</div> 
</div> 
</body> 
</html>

[Ctrl+A 全选注:如需引入外部Js需刷新才能执行]

加载全部内容