1 <!DOCTYPE html>
2
3 <html>
4 <head>
5 <meta charset="UTF-8">
6 <title>calculator</title>
7 <style type="text/css">
8
9 .TheBigestBox {
10 background-color:gray;
11 color:white;
12 width:500px;
13 height:500px;
14 margin: 0px auto;
15 line-height:40px;
16 font-size:20px;
17 }
18 .resultline {
19 background-color:white;
20 color:red;
21 width:500px;
22 height:80px;
23
24 }
25 .behandResultline {
26 height:40px;
27 text-align:center;
28 color: black;
29 background-color: gray;
30 width: 500px;
31 font-family: "Consolas";
32 font-size:16px;
33 }
34 .lineSubElement {
35
36 height:84px;
37 width: 500px;
38 background-color: white;
39 }
40 .littleButton {
41 text-align: center;
42 color: black;
43 font-size:40px;
44 line-height:80px;
45 height:80px;
46 width: 125px;
47 float: left;
48 }
49 .divtest {
50 width:496px;
51 height:80px;
52 line-height:80px;
53 font-size:40px;
54 color: red;
55 border:2px solid gray;
56 text-align:center;
57 }
58 button{background-color:gray}
59 button:hover {background-color:blue}
60 </style>
61 <script type="text/javascript">
62
63 //0 for init
64 //1 for input an 0 on the top of expreession
65 //2 for input other number
66 //3 for +,-, *, / operator
67 //4 for put .
68 //5 for little number
69
70 var flagNo = 0;
71 var flagArray = new Array();
72 var size = 1;
73 flagArray[0] = flagNo;
74
75
76 function addstack(flagTemp) {
77 flagArray[size] = flagTemp;
78 size++;
79 //alert("push:" + flagTemp.toString());
80 }
81 function popstack() {
82 if (size == 1) {
83 //alert("pop:"+size.toString());
84 return 0;
85 } else if (size >= 2){
86 size--;
87 //alert("pop:" + flagArray[size - 1].toString());
88 return flagArray[size - 1];
89 }
90 }
91 function checkincludep(s) {
92 for (i = 0; i < s.length; i++) {
93 if (s.charAt(i) == '.') {
94 return 1;
95 }
96 }
97 return 0;
98 }
99 function cal() {
100 elementvar = document.getElementById('textinput');
101 try {
102 sum = eval(elementvar.innerText);
103 elementvar.innerText = sum;
104 analyzeAllExpression(elementvar.innerText);
105 return sum;
106 } catch (exception) {
107 alert("非法表达式");
108 }
109
110 }
111 function calcal(obj){
112 try {
113 sum = eval(obj);
114
115 return sum;
116 } catch (exception) {
117 alert("非法表达式");
118 }
119
120 }
121 function analyzeAllExpression(exprssStr) {
122 flagNo = 0;
123 size = 1;
124 for (i = 0; i < exprssStr.length; i++) {
125 switch (exprssStr.charAt(i)) {
126 case '0' :
127 switch (flagNo) {
128 case 0:
129 flagNo = 1;
130 addstack(flagNo);
131 break;
132 case 2:
133 flagNo = 2;
134 addstack(flagNo);
135 break;
136 case 3 :
137 flagNo = 1;
138 addstack(flagNo);
139 break;
140 case 4 :
141 flagNo = 5;
142 addstack(flagNo);
143 break;
144 case 5 :
145 flagNo = 5;
146 addstack(flagNo);
147 break;
148
149 }
150 break;
151 case '1' :
152 case '2' :
153 case '3' :
154 case '4' :
155 case '5' :
156 case '6' :
157 case '7' :
158 case '8' :
159 case '9' :
160 switch (flagNo) {
161 case 0 :
162 flagNo = 2;
163 addstack(flagNo);
164 break;
165 case 2 :
166 flagNo = 2;
167 addstack(flagNo);
168 break;
169 case 3 :
170 flagNo = 2;
171 addstack(flagNo);
172 break;
173 case 4 :
174 flagNo = 5;
175 addstack(flagNo);
176 break;
177 case 5 :
178 flagNo = 5;
179 addstack(flagNo);
180 break
181 }
182 break;
183 case '+' :
184 case '-' :
185 case '*' :
186 case '/' :
187 case '%' :
188 switch (flagNo) {
189 case 0 : if (exprssStr.charAt(i) == '+' || exprssStr.charAt(i) == '-'){
190 flagNo = 3;
191 addstack(flagNo);
192 } else {
193 alert("exception hapened");
194 }
195 break;
196 case 1 :
197 flagNo = 3;
198 addstack(flagNo);
199 break;
200 case 2 :
201 flagNo = 3;
202 addstack(flagNo);
203 break;
204 case 3 :
205 alert("exception hapened");
206 break;
207 case 4 :
208 alert("exception hapened");
209 break;
210 case 5 :
211 flagNo = 3;
212 addstack(flagNo);
213 break;
214 }
215 break;
216 case '.' :
217 switch (flagNo) {
218 case 0 :
219 alert("exception hapened");
220 break;
221 case 1 :
222 flagNo = 4;
223 addstack(flagNo);
224 break;
225 case 2 :
226 flagNo = 4;
227 addstack(flagNo);
228 break;
229 case 3 :
230 alert("exception hapened");
231 break;
232 case 4 :
233 alert("exception hapened");
234 break;
235 case 5:
236 alert("exception hapened");
237 break;
238 }
239 break;
240 }
241 }
242 }
243 function back() {
244 elementvar = document.getElementById('textinput');
245 testest = elementvar.innerText;
246 try {
247 if (flagNo == 1 || flagNo == 2 || flagNo == 5) {
248 testest = '-' + '(' + testest + ')'
249 sum = calcal(testest);
250
251
252 elementvar.innerText = sum;
253 analyzeAllExpression(elementvar.innerText);
254 } else {
255 return;
256 }
257 } catch (exception) {
258 alert(exception);
259 }
260 }
261 function clear() {
262 elementvar = document.getElementById('textinput');
263 elementvar.innerText = '';
264 }
265 function keyList(typeNo) {
266 elementvar = document.getElementById('textinput');
267 switch(typeNo) {
268 case '0' :
269 switch (flagNo) {
270 case 0:
271 flagNo = 1;
272 addstack(flagNo);
273 break;
274 case 1:
275 alert("首元素为0时候仅能输入小数点或者删除0的首元素");
276 return;
277 break;
278 case 2:
279 flagNo = 2;
280 addstack(flagNo);
281 break;
282 case 3 :
283 flagNo = 1;
284 addstack(flagNo);
285 break;
286 case 4 :
287 flagNo = 5;
288 addstack(flagNo);
289 break;
290 case 5 :
291 flagNo = 5;
292 addstack(flagNo);
293 break;
294
295 }
296 elementvar.innerText = elementvar.innerText + typeNo;
297
298 break;
299 case '1' :
300 case '2' :
301 case '3' :
302 case '4' :
303 case '5' :
304 case '6' :
305 case '7' :
306 case '8' :
307 case '9' :
308 switch (flagNo) {
309 case 0 :
310 flagNo = 2;
311 addstack(flagNo);
312 break;
313
314 case 1 :
315 alert("首元素为0时候仅能输入小数点或者删除0的首元素");
316 return;
317 case 2 :
318 flagNo = 2;
319 addstack(flagNo);
320 break;
321 case 3 :
322 flagNo = 2;
323 addstack(flagNo);
324 break;
325 case 4 :
326 flagNo = 5;
327 addstack(flagNo);
328 break;
329 case 5 :
330 flagNo = 5;
331 addstack(flagNo);
332 break
333 }
334 elementvar.innerText = elementvar.innerText + typeNo;
335
336 break;
337
338
339
340 case '+' :
341 case '-' :
342 case '*' :
343 case '/' :
344 case '%' :
345 switch (flagNo) {
346 case 0 : if (typeNo == '+' || typeNo == '-'){
347 flagNo = 3;
348 addstack(flagNo);
349 } else {
350 return;
351 }
352 case 1 :
353 flagNo = 3;
354 addstack(flagNo);
355 break;
356 case 2 :
357 flagNo = 3;
358 addstack(flagNo);
359 break;
360 case 3 :
361 return;
362 case 4 :
363 return;
364 case 5 :
365 flagNo = 3;
366 addstack(flagNo);
367 break;
368
369 }
370 elementvar.innerText = elementvar.innerText + typeNo;
371
372 break;
373 case '.' :
374
375 switch (flagNo) {
376 case 0 :
377 return;
378 case 1 :
379 flagNo = 4;
380 addstack(flagNo);
381 break;
382 case 2 :
383 flagNo = 4;
384 addstack(flagNo);
385 break;
386 case 3 :
387 return;
388 case 4 :
389 return;
390 case 5:
391 return;
392 }
393 elementvar.innerText = elementvar.innerText + typeNo;
394
395 break;
396 case 'AC': {
397 flagNo = 0;
398 size = 1;
399 elementvar.innerText = "";
400 }
401
402 case '=': if (flagNo == 1 || flagNo == 2 || flagNo == 5) {
403 cal();
404 } else {
405 return;
406 }
407 break;
408
409 case '+/-':
410 back();
411
412 break;
413 case 'DEL' : {
414 flagNo = popstack();
415 if (size >= 1) {
416 elementvar.innerText = elementvar.innerText.substr(0, elementvar.innerText.length - 1);
417 }
418 }
419 break;
420 }
421
422 }
423 </script>
424 </head>
425
426 <body>
427 <div class="TheBigestBox">
428 <div class="behandResultline">小毛计算器</div>
429 <div class="resultline">
430 <div class="divtest" name="lname" id="textinput"></div>
431 </div>
432 <div class="lineSubElement">
433
434 <button class="littleButton" onclick="keyList('AC')">AC</button>
435 <button class="littleButton" onclick="keyList('+/-')">+/-</button>
436 <button class="littleButton" onclick="keyList('%')">%</button>
437 <button class="littleButton" onclick="keyList('/')">÷</button>
438
439 </div>
440 <div class="lineSubElement">
441 <button class="littleButton" onclick="keyList('7')">7</button>
442 <button class="littleButton" onclick="keyList('8')">8</button>
443 <button class="littleButton" onclick="keyList('9')">9</button>
444 <button class="littleButton" onclick="keyList('*')">*</button>
445 </div>
446
447 <div class="lineSubElement">
448 <button class="littleButton" onclick="keyList('4')">4</button>
449 <button class="littleButton" onclick="keyList('5')">5</button>
450 <button class="littleButton" onclick="keyList('6')">6</button>
451 <button class="littleButton" onclick="keyList('-')">-</button>
452 </div>
453 <div class="lineSubElement">
454 <button class="littleButton" onclick="keyList('1')">1</button>
455 <button class="littleButton" onclick="keyList('2')">2</button>
456 <button class="littleButton" onclick="keyList('3')">3</button>
457 <button class="littleButton" onclick="keyList('+')">+</button>
458 </div>
459 <div class="lineSubElement">
460 <button class="littleButton" onclick="keyList('0')">0</button>
461 <button class="littleButton" onclick="keyList('DEL')">DEL</button>
462 <button class="littleButton" onclick="keyList('.')">.</button>
463 <button class="littleButton" onclick="keyList('=')">=</button>
464 </div>
465 </div>
466
467 </body>
468 </html>
