JS实现的计算器_js

js实现的计算器，如下代码：

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="calc.aspx.cs" Inherits="calc" %> 
 
<!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 runat="server"> 
<title>JS计算器 - www.cxybl.com</title> 
<style type="text/css"> 
.style1 
{ 
width: 22%; 
} 
#Button1 
{ 
height: 41px; 
width: 60px; 
} 
#Button2 
{ 
height: 41px; 
width: 60px; 
} 
#Button3 
{ 
height: 41px; 
width: 63px; 
} 
#Button4 
{ 
height: 41px; 
width: 64px; 
} 
#Button5 
{ 
height: 41px; 
width: 57px; 
} 
#Button6 
{ 
height: 41px; 
width: 61px; 
} 
#Button7 
{ 
height: 41px; 
width: 64px; 
} 
#Button8 
{ 
height: 41px; 
width: 64px; 
} 
#Button9 
{ 
height: 41px; 
width: 62px; 
} 
#Button10 
{ 
height: 41px; 
width: 63px; 
} 
#Button11 
{ 
height: 41px; 
width: 67px; 
} 
#Button12 
{ 
height: 41px; 
width: 64px; 
} 
#Button13 
{ 
height: 41px; 
width: 61px; 
} 
#Button14 
{ 
height: 41px; 
width: 59px; 
} 
#Button15 
{ 
height: 41px; 
width: 67px; 
} 
#Button16 
{ 
height: 41px; 
width: 65px; 
} 
#Text1 
{ 
width: 258px; 
height: 38px; 
} 
.style2 
{ 
width: 62px; 
} 
#Button17 
{ 
height: 41px; 
width: 61px; 
} 
#Button18 
{ 
height: 41px; 
width: 63px; 
} 
#Button19 
{ 
height: 41px; 
width: 67px; 
} 
#Button20 
{ 
height: 41px; 
width: 62px; 
} 
</style> 
<script language="javascript" type="text/javascript"> 
var num; 
function btntext(num) { 
document.getElementById('Text1').value += document.getElementById(num).value; 
}//给文本框赋值 
function ev() { 
document.getElementById('Text1').value = eval(document.getElementById('Text1').value); 
} //计算文本框内的表达式 
function clear() { 
document.getElementById('Text1').value =0; 
} //吧文本框内的内容清0 
function SQRT() { 
var disp = document.getElementById('Text1'); 
disp.value = Math.sqrt(disp.value); 
 
}//开根号 
 
function Pow() { 
var disp = document.getElementById('Text1'); 
disp.value = Math.pow(disp.value, 2); 
}//平方 
function del() { 
var disp = document.getElementById('Text1'); 
dispdisp.value = disp.value.substring(0, disp.value.length - 1) 
} //删除 
</script> 
</head> 
<body> 
<form id="form1" runat="server"> 
<div> 
<table align="center" class="style1" 
style="background-color: #C0C0C0; height: 291px;"> 
<tr> 
<td colspan="4" style="background-color: #00FFFF; text-align: center;"> 
<input id="Text1" type="text" /></td> 
</tr> 
<tr> 
<td style="background-color: #00FFFF"> 
<input id="+" type="button" value="+" onclick="btntext('+')"/></td> 
<td style="background-color: #00FFFF"> 
<input id="1" type="button" value="1" name='1' onclick="btntext('1')" /></td> 
<td style="background-color: #00FFFF"> 
<input id="2" type="button" value="2" onclick="btntext('2')"/></td> 
<td class="style2" style="background-color: #00FFFF"> 
<input id="3" type="button" value="3" onclick="btntext('3')"/></td> 
</tr> 
<tr> 
<td style="background-color: #00FFFF"> 
<input id="-" type="button" value="-" onclick="btntext('-')"/></td> 
<td style="background-color: #00FFFF"> 
<input id="4" type="button" value="4" onclick="btntext('4')"/></td> 
<td style="background-color: #00FFFF"> 
<input id="5" type="button" value="5" onclick="btntext('5')"/></td> 
<td class="style2" style="background-color: #00FFFF"> 
<input id="6" type="button" value="6" onclick="btntext('6')"/></td> 
</tr> 
<tr> 
<td style="background-color: #00FFFF"> 
<input id="*" type="button" value="*" onclick="btntext('*')"/></td> 
<td style="background-color: #00FFFF"> 
<input id="7" type="button" value="7" onclick="btntext('7')"/></td> 
<td style="background-color: #00FFFF"> 
<input id="8" type="button" value="8" onclick="btntext('8')"/></td> 
<td class="style2" style="background-color: #00FFFF"> 
<input id="9" type="button" value="9" onclick="btntext('9')"/></td> 
</tr> 
<tr> 
<td style="background-color: #00FFFF"> 
<input id="/" type="button" value="/" onclick="btntext('/')"/></td> 
<td style="background-color: #00FFFF"> 
<input id="0" type="button" value="0" onclick="btntext('0')"/></td> 
<td style="background-color: #00FFFF"> 
<input id="." type="button" value="." style="font-weight: bold" onclick="btntext('.')"/></td> 
<td class="style2" style="background-color: #00FFFF"> 
<input id="Button16" type="button" value="=" onclick="ev()"/></td> 
</tr> 
<tr> 
<td style="background-color: #00FFFF"> 
<input id='根号' type="button" value="√" onclick="SQRT()"/></td> 
<td style="background-color: #00FFFF"> 
<input id="平方" type="button" value="²" onclick="Pow()"/></td> 
<td style="background-color: #00FFFF"> 
<input id="Button19" type="button" value="C" onclick="clear()"/></td> 
<td class="style2" style="background-color: #00FFFF"> 
<input id="Button20" type="button" value="←" onclick="del()"/></td> 
</tr> 
</table> 
</div> 
</form> 
</body> 
</html>

欢迎大家阅读《JS实现的计算器_js》,跪求各位点评,若觉得好的话请收藏本文，by 搞代码

搞代码网（gaodaima.com）提供的所有资源部分来自互联网，如果有侵犯您的版权或其他权益，请说明详细缘由并提供版权或权益证明然后发送到邮箱[email protected]‍，我们会在看到邮件的第一时间内为您处理，或直接联系QQ：872152909。本网站采用BY-NC-SA协议进行授权
转载请注明原文链接：JS实现的计算器_js

Hi，您需要填写昵称和邮箱！