每日一JavaScript:能进行四则混合运算的计算器

网上也有下面部分的代码,不过这段代码经过我的修改了,原有代码中“AC”这个按钮无效,我到现在还不明白什么原因,所以只用了更简单的方法reset来解决掉。你可以点击这里查看效果。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
<!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>
</head>
<body>
<h1>能进行四则混合运算的计算器</h1>
<script type="text/javascript">
<!--
function compute(obj) //计算并输出结果
{
	obj.expr.value=eval(obj.expr.value);
}
//定义10个数字以及各种运算符
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;
}
//-->
</script>
<form name="clac">
<table  border="1" cellspacing="0" cellpadding="0">
  <tr>
    <td colspan="4"><input type="text" name="expr" size="30" accept="compute(this.form)" /></td>
  </tr>
  <tr>
    <td><input type="button" value="  7  " onclick="enter(this.form,seven)" /></td>
    <td><input type="button" value="  8  " onclick="enter(this.form,eight)" /></td>
    <td><input type="button" value="  9  " onclick="enter(this.form,nine)" /></td>
    <td><input type="button" value="  /  " onclick="enter(this.form,divide)" /></td>
  </tr>
  <tr>
    <td><input type="button" value="  4  " onclick="enter(this.form,four)" /></td>
    <td><input type="button" value="  5  " onclick="enter(this.form,five)" /></td>
    <td><input type="button" value="  6  " onclick="enter(this.form,six)" /></td>
    <td><input type="button" value="  *  " onclick="enter(this.form,multiply)" /></td>
  </tr>
  <tr>
    <td><input type="button" value="  1  " onclick="enter(this.form,one)" /></td>
    <td><input type="button" value="  2  " onclick="enter(this.form,two)" /></td>
    <td><input type="button" value="  3  " onclick="enter(this.form,three)" /></td>
    <td><input type="button" value="  -  " onclick="enter(this.form,minus)" /></td>
  </tr>
  <tr>
    <td colspan="2"><input type="button" value="  0  " onclick="enter(this.form,zero)" /></td>
    <td><input type="button" value="  .  " onclick="enter(this.form,decimal)" /></td>
    <td><input type="button" value="  +  " onclick="enter(this.form,plus)" /></td>
  </tr>
  <tr>
    <td colspan="2"><input type="button" value="  =  " onclick="compute(this.form)" /></td>
    <td colspan="2"><input type="reset" value="  AC  " size="3" /></td>
  </tr>
</table>
</form>
</body>
</html>

4 Responses to “每日一JavaScript:能进行四则混合运算的计算器”

  1. 很好用,不错!

  2. yinheli says:

    胡戈戈.你能不能写个文章和我们分享一下你所用的ff 扩展…我装了一堆.打开好慢.不知道选些什么样的比较适合自己.你分享一下吧.哈.我比较懒 -_-!

  3. 胡戈戈 says:

    @yinheli 就这个啊,以前有写过,现在差不多还在用这些
    http://hugege.com/2008/09/09/firefox-addons/

  4. yinheli says:

    @胡戈戈 相当不错.我借鉴一下.我关注胡戈戈太少了…以后要常来.

Post a Comment