|
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
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
|
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> 계산기 </TITLE>
<style>
caption {font-size:60px; margin-bottom:20px;}
table td input {font-size:20px; background:white; width:100%;height:50px;}
table td {width:100px;}
.numcolor {background-color:#8CC2FA; color:white;}
.calcolor {background-color:#1278B3; color:white;}
#num {text-align:right;}
</style>
<script language="javascript">
var num1=0;
var num2=0;
var state;
var result;
function inputNum(a){
document.getElementById("num").value +=a;
}
function change(){
var pm = document.getElementById("num").value;
if(pm > 0) document.getElementById("num").value = -pm;
}
function calcul(a){
num1 = document.getElementById("num").value;
if(a == "pow") {
state = "pow";
document.getElementById("num").value=null;
}
if(a == "sin") {
state = "sin";
result = Math.sin(num1);
document.getElementById("num").value = result;}
if(a == "cos") {
state = "cos";
result = Math.cos(num1);
document.getElementById("num").value = result;}
if(a == "tan") {
state = "tan";
result = Math.tan(num1);
document.getElementById("num").value = result;}
if(a=="sum"){
state = "sum";
document.getElementById("num").value=null;
}
if(a=="minus"){
state = "minus";
document.getElementById("num").value=null;
}
if(a=="mul"){
state = "mul";
document.getElementById("num").value=null;
}
if(a=="div"){
state = "div";
document.getElementById("num").value=null;
}
}
function end(){
num2 = document.getElementById("num").value;
if(state == "pow") result = Math.pow(num1,num2);
if(state == "sum") result = Number(num1)+Number(num2);
if(state == "minus") result = num1 - num2;
if(state == "mul") result = num1 * num2;
if(state == "div") result = num1 / num2;
document.getElementById("num").value = result;
}
</script>
</HEAD>
<BODY>
<form>
<center>
<table border="1px solid">
<caption>계산기</caption>
<tr>
<td colspan="5"><input type="text" id = "num" size="100%"></td>
</tr>
<tr>
<td colspan="3"><input type="reset" value="Clear" width="100%"></td>
<td colspan="2"><input type="button" value="=" onClick="end()"></td>
</tr>
<tr>
<td><input type="button" class="numcolor" onClick="inputNum(1)" value="1"></td>
<td><input type="button" class="numcolor" onClick="inputNum(2)" value="2"></td>
<td><input type="button" class="numcolor" onClick="inputNum(3)" value="3"></td>
<td><input type="button" value="+" class="calcolor" onClick="calcul('sum')"></td>
<td><input type="button" value="x^y" class="calcolor" onClick="calcul('pow')"></td>
</tr>
<tr>
<td><input type="button" class="numcolor" onClick="inputNum(4)" value="4"></td>
<td><input type="button" class="numcolor" onClick="inputNum(5)" value="5"></td>
<td><input type="button" class="numcolor" onClick="inputNum(6)" value="6"></td>
<td><input type="button" value="-" class="calcolor" onClick="calcul('minus')"></td>
<td><input type="button" value="sin" class="calcolor" onClick="calcul('sin')"></td>
</tr>
<tr>
<td><input type="button" class="numcolor" onClick="inputNum(7)" value="7"></td>
<td><input type="button" class="numcolor" onClick="inputNum(8)" value="8"></td>
<td><input type="button" class="numcolor" onClick="inputNum(9)" value="9"></td>
<td><input type="button" value="*" class="calcolor" onClick="calcul('mul')"></td>
<td><input type="button" value="cos" class="calcolor" onClick="calcul('cos')"></td>
</tr>
<tr>
<td><input type="button" class="numcolor" onClick="inputNum(0)" value="0"></td>
<td><input type="button" value="+/-" class="numcolor" onClick="change()"></td>
<td><input type="button" value="." class="numcolor" onClick="inputNum('.')"></td>
<td><input type="button" value="/" class="calcolor" onClick="calcul('div')"></td>
<td><input type="button" value="tan" class="calcolor" onClick="calcul('tan')"></td>
</tr>
</table>
</center>
</form>
</BODY>
</HTML>
http://colorscripter.com/info#e" target="_blank" style="color:#4f4f4f; text-decoration:none">Colored by Color Scripter
|
'HTML & CSS & JAVASCRIPT' 카테고리의 다른 글
| 예제_push,pop (0) | 2019.06.20 |
|---|---|
| 예제_input type 활용 (0) | 2019.06.20 |
| JAVASCRIPT 예제_prompt, confirm (0) | 2019.06.20 |
| JAVASCRIPT 예제_오른쪽마우스 막기, 스크롤 금지 (0) | 2019.06.20 |
| JAVASCRIPT 예제_바뀌는 이미지 (0) | 2019.06.20 |