毛子计算器
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>