<html>
<meta name="content-type" content="text/html charset=UTF-8">
<head>
<title>Calculator</title>
<!--将按键内容以字符串形式存储在文字框中当按钮为“=”时，调用eval方法计算结果然后将结果输出文字框中-->
<script type="text/javascript">
var numresult
var str
function onclicknum(nums) {
str = document.getElementById("nummessege")
str.value = str.value + nums
}
function onclickclear() {
str = document.getElementById("nummessege")
str.value = ""
}
function onclickresult() {
str = document.getElementById("nummessege")
numresult = eval(str.value)
str.value = numresult
}
</script>
</head>
<body bgcolor="skyblue" >
<!--定义按键表格,每个按键对应一个事件触发-->
<table border="1" align="center" bgColor="skyblue"
style="height: 350px width: 270px">
<tr>
<td colspan="4">
<input type="text" id="nummessege"
style="height: 90px width: 350px font-size: 50px" />
</td>
</tr>
<tr>
<td>
<input type="button" value="1" id="1" onclick="onclicknum(1)"
style="height: 70px width: 90px font-size: 35px">
</td>
<td>
<input type="button" value="2" id="2" onclick="onclicknum(2)"
style="height: 70px width: 90px font-size: 35px">
</td>
<td>
<input type="button" value="3" id="3" onclick="onclicknum(3)"
style="height: 70px width: 90px font-size: 35px">
</td>
<td>
<input type="button" value="+" id="add" onclick="onclicknum('+')"
style="height: 70px width: 90px font-size: 35px">
</td>
</tr>
<tr>
<td>
<input type="button" value="4" id="4" onclick="onclicknum(4)"
style="height: 70px width: 90px font-size: 35px">
</td>
<td>
<input type="button" value="5" id="5" onclick="onclicknum(5)"
style="height: 70px width: 90px font-size: 35px">
</td>
<td>
<input type="button" value="6" id="6" onclick="onclicknum(6)"
style="height: 70px width: 90px font-size: 35px">
</td>
<td>
<input type="button" value="-" id="sub" onclick="onclicknum('-')"
style="height: 70px width: 90px font-size: 35px">
</td>
</tr>
<tr>
<td>
<input type="button" value="7" id="7" onclick="onclicknum(7)"
style="height: 70px width: 90px font-size: 35px">
</td>
<td>
<input type="button" value="8" id="8" onclick="onclicknum(8)"
style="height: 70px width: 90px font-size: 35px">
</td>
<td>
<input type="button" value="9" id="9" onclick="onclicknum(9)"
style="height: 70px width: 90px font-size: 35px">
</td>
<td>
<input type="button" value="*" id="mul" onclick="onclicknum('*')"
style="height: 70px width: 90px font-size: 35px">
</td>
</tr>
<tr>
<td colspan="2">
<input type="button" value="0" id="0" onclick="onclicknum(0)"
style="height: 70px width: 190px font-size: 35px">
</td>
<td>
<input type="button" value="." id="point" onclick="onclicknum('.')"
style="height: 70px width: 90px font-size: 35px">
</td>
<td>
<input type="button" value="/" id="division"
onclick="onclicknum('/')"
style="height: 70px width: 90px font-size: 35px">
</td>
</tr>
<tr>
<td colspan="2">
<input type="button" value="Del" id="clear"
onclick="onclickclear()"
style="height: 70px width: 190px font-size: 35px" />
</td>
<td colspan="2">
<input type="button" value="=" id="result"
onclick="onclickresult()"
style="height: 70px width: 190px font-size: 35px" />
</td>
</tr>
</table>
</body>
</html>
你先把：<script language="JaveScript">
改成：
<script language="javascript">
改了之后你再调整看看。
其它的自己应该能解决了吧。
首先要说明一点，纯html是不能编辑计算器的，因为html是标记语言，不是编程语言，不能编辑程序，要写计算器，还需要js代码，下面为全部代码：<html>
<head>
<title>计算器</title>
<meta http-equiv="Content-Type" content="text/htmlcharset=UTF-8"/>
</head>
<body>
<script language="JavaScript">
<!-- Hide the script from old browsers --
function compute(obj)
{obj.expr.value = eval(obj.expr.value)}
var one = '1'
var two = '2'
var three = '3'
var four = '4'
var five = '5'
var six = '6'
var seven = '7'
var eight = '8'
var nine = '9'
var zero = '0'
var plus = '+'
var minus = '-'
var multiply = '*'
var divide = '/'
var decimal = '.'
function enter(obj, string)
{obj.expr.value += string}
function clear(obj)
{obj.expr.value = ''}
// --End Hiding Here -->
</script>
<form name="calc">
<table border=1>
<td colspan=4><input type="text" name="expr" size=30 action="compute(this.form)"><tr>
<td><input type="button" value=" 7 " onClick="enter(this.form, seven)">
<td><input type="button" value=" 8 " onClick="enter(this.form, eight)">
<td><input type="button" value=" 9 " onClick="enter(this.form, nine)">
<td><input type="button" value=" / " onClick="enter(this.form, divide)">
<tr><td><input type="button" value=" 4 " onClick="enter(this.form, four)">
<td><input type="button" value=" 5 " onClick="enter(this.form, five)">
<td><input type="button" value=" 6 " onClick="enter(this.form, six)">
<td><input type="button" value=" * " onClick="enter(this.form, multiply)">
<tr><td><input type="button" value=" 1 " onClick="enter(this.form, one)">
<td><input type="button" value=" 2 " onClick="enter(this.form, two)">
<td><input type="button" value=" 3 " onClick="enter(this.form, three)">
<td><input type="button" value=" - " onClick="enter(this.form, minus)">
<tr><td colspan=2><input type="button" value=" 0 " onClick="enter(this.form, zero)">
<td><input type="button" value=" . " onClick="enter(this.form, decimal)">
<td><input type="button" value=" + " onClick="enter(this.form, plus)">
<tr><td colspan=2><input type="button" value=" = " onClick="compute(this.form)">
<td colspan=2><input type="button" value="AC" size= 3 onClick="clear(this.form)"></table>
</form>
</body>
</html>
欢迎分享，转载请注明来源：内存溢出
微信扫一扫
支付宝扫一扫
评论列表（0条）