可以实现基本的加减乘除的运算
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="ClacTest.aspx.cs" Inherits="calc.clac" %>
<!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></title>
<script type="text/javascript">
var fuhao;
var num1="";
var num2="";
var num3="";
var pan="";
<%--数字代码--%>
function Number(obj) {
document.getElementById('txtShow').value += obj;
}
<%--加减乘除代码--%>
function yunsun(p) {
var num=document.getElementById('txtShow');
if(pan=="")
{
switch (p) {
case '+':
num1 = num.value;
num.value = "";
fuhao = p;
break;
case '-':
num1 = num.value;
num.value = "";
fuhao = p;
break;
case '*':
num1 = num.value;
num.value = "";
fuhao = p;
break;
case '/':
num1 = num.value;
num.value = "";
fuhao = p;
break;
}
pan=12;
}
else if(pan!="") {
switch (fuhao) {
case '+':
num2 = num.value;
num.value = parseFloat(num1) + parseFloat(num2);
num1=num.value;
num.value="";
break;
case '-':
num2 = num.value;
num.value = parseFloat(num1) - parseFloat(num2);
num1=num.value;
num.value="";
break;
case '*':
num2 = num.value;
num.value = parseFloat(num1) *parseFloat(num2);
num1=num.value;
num.value="";
break;
case '/':
num2 = num.value;
num.value = parseFloat(num1) / parseFloat(num2);
num1=num.value;
num.value="";
break;
}
num2="";
}
}
<%--等号代码--%>
function denghao() {
var num = document.getElementById('txtShow');
if (fuhao != "") {
switch (fuhao) {
case '+':
num2 = num.value;
num.value = parseFloat(num1) + parseFloat(num2);
break;
case '-':
num2 = num.value;
num.value = parseFloat(num1) - parseFloat(num2);
break;
case '*':
num2 = num.value;
num.value = parseFloat(num1) *parseFloat(num2);
break;
case '/':
num2 = num.value;
num.value = parseFloat(num1) / parseFloat(num2);
break;
}
}
pan="";
}
<%--清空符号--%>
function qinkong()
{
document.getElementById('txtShow').value="";
num1="";
num2="";
num3="";
pan="";
}
<%--后退代码--%>
function backspace(){
var num=document.getElementById('txtShow');
num3=num.value.substring(0,num.value.length-1);
document.getElementById('txtShow').value=num3;
}
</script>
<style type="text/css">
.style1
{
width: 300px;
height: 350px;
}
.style2
{
text-align: center;
font-weight: 700;
}
.style3
{
text-align: center;
font-weight: 700;
height: 39px;
font-size: x-large;
}
#Button6
{
margin-top: 5px;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<div>
<table class="style1" align="center" bgcolor="#666666">
<tr>
<td class="style3" colspan="7">
JavaScriptClac</td>
</tr>
<tr>
<td class="style2" rowspan="5">
</td>
<td class="style2" colspan="5">
<asp:TextBox ID="txtShow" runat="server" Height="45px" Width="255px"
style="text-align: right"></asp:TextBox>
</td>
<td class="style2" rowspan="5">
</td>
</tr>
<tr>
<td class="style2">
<input id="Button14" type="button" value="7" οnclick="Number(7)"/></td>
<td class="style2">
<input id="Button15" type="button" value="8" οnclick="Number(8)"/></td>
<td class="style2">
<input id="Button16" type="button" value="9" οnclick="Number(9)"/></td>
<td class="style2">
<input id="Button17" type="button" value="/" οnclick="yunsun('/')"/></td>
<td class="style2">
<input id="Button18" type="button" value="C" οnclick="qinkong()"/></td>
</tr>
<tr>
<td class="style2">
<input id="Button9" type="button" value="4" οnclick="Number(4)"/></td>
<td class="style2">
<input id="Button10" type="button" value="5" οnclick="Number(5)"/></td>
<td class="style2">
<input id="Button11" type="button" value="6" οnclick="Number(6)"/></td>
<td class="style2">
<input id="Button12" type="button" value="*" οnclick="yunsun('*')"/></td>
<td class="style2">
<input id="Button13" type="button" value="←" οnclick="backspace()"/></td>
</tr>
<tr>
<td class="style2">
<input id="Button5" type="button" value="1" οnclick="Number(1)"/></td>
<td class="style2">
<input id="Button6" type="button" value="2" οnclick="Number(2)"/></td>
<td class="style2">
<input id="Button7" type="button" value="3" οnclick="Number(3)"/></td>
<td class="style2">
<input id="Button8" type="button" value="-" οnclick="yunsun('-')"/></td>
<td class="style2" rowspan="2">
<input id="Button4" type="button" value="=" οnclick="denghao()"/></td>
</tr>
<tr>
<td class="style2" colspan="2">
<input id="Button1" type="button" value="0" οnclick="Number(0)"/></td>
<td class="style2">
<input id="Button2" type="button" value="." οnclick="Number('.')"/></td>
<td class="style2" bgcolor="#666666">
<input id="Button3" type="button" value="+" οnclick="yunsun('+')"/></td>
</tr>
</table>
</div>
</form>
</body>
</html>