Javascript 实现简单计算器实例代码
Posted SnowLover
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了Javascript 实现简单计算器实例代码相关的知识,希望对你有一定的参考价值。
javascript 实现简单计算器实例代码
这篇文章主要介绍了Javascript 实现简单计算器实例代码的相关资料,需要的朋友可以参考下
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
|
<!DOCTYPE html> <html> <head> <meta charset= "utf-8" > <title>js简单计算器</title> <style type= "text/css" > *{ margin:0px; padding:0px; } input{ margin-top:2px; margin-left:2px; width:230px; height:30px; text-align:right; } button{ margin-top:2px; margin-left:2px; width:50px; height:50px; } #container{ margin-left:1px; border:1px solid #E4E4E4; background: #BBBBBB; width:235px; height:215px; } </style> <script> function onLoad(){ //加载完毕后光标自动对应到输入框 document.getElementById( "input" ).focus(); } //读取按钮的值,传给输入框 function inputEvent(e){ //把val的值改为每个事件的innerHTML值 var val=e.innerHTML; //获取input标签 var xsval=document.getElementById( "input" ); //标签里的value连接每个事件的innerHTML值 xsval.value+=val; } //计算出结果 function inputOper(){ var xsval=document.getElementById( "input" ); xsval.value=eval(document.getElementById( "input" ).value); } //清零 function clearNum(){ var xsval=document.getElementById( "input" ); xsval.value= "" ; document.getElementById( "input" ).focus(); } //退格 function backNum(){ var arr=document.getElementById( "input" ); arr.value=arr.value.substring(0,arr.value.length-1); } |
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
|
</script> </head> <body onload= "onLoad()" > <input id= "input" type= "text" > <div id= "container" > <div> <button onclick= "inputEvent(this)" >1</button> <button onclick= "inputEvent(this)" >2</button> <button onclick= "inputEvent(this)" >3</button> <button onclick= "inputEvent(this)" >+</button> </div> <div> <button onclick= "inputEvent(this)" >4</button> <button onclick= "inputEvent(this)" >5</button> <button onclick= "inputEvent(this)" >6</button> <button onclick= "inputEvent(this)" >-</button> </div> <div> <button onclick= "inputEvent(this)" >7</button> <button onclick= "inputEvent(this)" >8</button> <button onclick= "inputEvent(this)" >9</button> <button onclick= "inputEvent(this)" >*</button> </div> <div> <button onclick= "inputEvent(this)" >0</button> <button onclick= "inputEvent(this)" >.</button> <button onclick= "inputOper(this)" >=</button> <button onclick= "inputEvent(this)" >/</button> </div> </div> <button onclick= "clearNum()" >清零</button> <button onclick= "backNum()" >退格</button> </body> </html> |
(转载) http://www.jb51.net/article/95464.htm
以上是关于Javascript 实现简单计算器实例代码的主要内容,如果未能解决你的问题,请参考以下文章