计算器代码

  1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2  <!-- $Id: calculator.htm 14216 2008-03-10 02:27:21Z testyang $ -->
  3  <html xmlns="http://www.w3.org/1999/xhtml">
  4 <head>
  5   <title>计算器</title>
  6   <script type="text/javascript">
  7   /* $Id : utils.js 5052 2007-02-03 10:30:13Z weberliu $ */
  8 
  9 var Browser = new Object();
 10 
 11 Browser.isMozilla = (typeof document.implementation != 'undefined') && (typeof document.implementation.createDocument != 'undefined') && (typeof HTMLDocument != 'undefined');
 12 Browser.isIE = window.ActiveXObject ? true : false;
 13 Browser.isFirefox = (navigator.userAgent.toLowerCase().indexOf("firefox") != - 1);
 14 Browser.isSafari = (navigator.userAgent.toLowerCase().indexOf("safari") != - 1);
 15 Browser.isOpera = (navigator.userAgent.toLowerCase().indexOf("opera") != - 1);
 16 
 17 var Utils = new Object();
 18 
 19 Utils.htmlEncode = function(text)
 20 {
 21   return text.replace(/&/g, '&').replace(/"/g, '"').replace(/</g, '<').replace(/>/g, '>');
 22 }
 23 
 24 Utils.trim = function( text )
 25 {
 26   if (typeof(text) == "string")
 27   {
 28     return text.replace(/^\s*|\s*$/g, "");
 29   }
 30   else
 31   {
 32     return text;
 33   }
 34 }
 35 
 36 Utils.isEmpty = function( val )
 37 {
 38   switch (typeof(val))
 39   {
 40     case 'string':
 41       return Utils.trim(val).length == 0 ? true : false;
 42       break;
 43     case 'number':
 44       return val == 0;
 45       break;
 46     case 'object':
 47       return val == null;
 48       break;
 49     case 'array':
 50       return val.length == 0;
 51       break;
 52     default:
 53       return true;
 54   }
 55 }
 56 
 57 Utils.isNumber = function(val)
 58 {
 59   var reg = /^[\d|\.|,]+$/;
 60   return reg.test(val);
 61 }
 62 
 63 Utils.isInt = function(val)
 64 {
 65   if (val == "")
 66   {
 67     return false;
 68   }
 69   var reg = /\D+/;
 70   return !reg.test(val);
 71 }
 72 
 73 Utils.isEmail = function( email )
 74 {
 75   var reg1 = /([\w-\.]+)@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.)|(([\w-]+\.)+))([a-zA-Z]{2,4}|[0-9]{1,3})(\]?)/;
 76 
 77   return reg1.test( email );
 78 }
 79 
 80 Utils.isTel = function ( tel )
 81 {
 82   var reg = /^[\d|\-|\s|\_]+$/; //只允许使用数字-空格等
 83 
 84   return reg.test( tel );
 85 }
 86 
 87 Utils.fixEvent = function(e)
 88 {
 89   var evt = (typeof e == "undefined") ? window.event : e;
 90   return evt;
 91 }
 92 
 93 Utils.srcElement = function(e)
 94 {
 95   if (typeof e == "undefined") e = window.event;
 96   var src = document.all ? e.srcElement : e.target;
 97 
 98   return src;
 99 }
100 
101 Utils.isTime = function(val)
102 {
103   var reg = /^\d{4}-\d{2}-\d{2}\s\d{2}:\d{2}$/;
104 
105   return reg.test(val);
106 }
107 
108 Utils.x = function(e)
109 { //当前鼠标X坐标
110     return Browser.isIE?event.x + document.documentElement.scrollLeft - 2:e.pageX;
111 }
112 
113 Utils.y = function(e)
114 { //当前鼠标Y坐标
115     return Browser.isIE?event.y + document.documentElement.scrollTop - 2:e.pageY;
116 }
117 
118 Utils.request = function(url, item)
119 {
120     var sValue=url.match(new RegExp("[\?\&]"+item+"=([^\&]*)(\&?)","i"));
121     return sValue?sValue[1]:sValue;
122 }
123 
124 Utils.$ = function(name)
125 {
126     return document.getElementById(name);
127 }
128 
129 function rowindex(tr)
130 {
131   if (Browser.isIE)
132   {
133     return tr.rowIndex;
134   }
135   else
136   {
137     table = tr.parentNode.parentNode;
138     for (i = 0; i < table.rows.length; i ++ )
139     {
140       if (table.rows[i] == tr)
141       {
142         return i;
143       }
144     }
145   }
146 }
147 
148 document.getCookie = function(sName)
149 {
150   // cookies are separated by semicolons
151   var aCookie = document.cookie.split("; ");
152   for (var i=0; i < aCookie.length; i++)
153   {
154     // a name/value pair (a crumb) is separated by an equal sign
155     var aCrumb = aCookie[i].split("=");
156     if (sName == aCrumb[0])
157       return decodeURIComponent(aCrumb[1]);
158   }
159 
160   // a cookie with the requested name does not exist
161   return null;
162 }
163 
164 document.setCookie = function(sName, sValue, sExpires)
165 {
166   var sCookie = sName + "=" + encodeURIComponent(sValue);
167   if (sExpires != null)
168   {
169     sCookie += "; expires=" + sExpires;
170   }
171 
172   document.cookie = sCookie;
173 }
174 
175 document.removeCookie = function(sName,sValue)
176 {
177   document.cookie = sName + "=; expires=Fri, 31 Dec 1999 23:59:59 GMT;";
178 }
179 
180 function getPosition(o)
181 {
182     var t = o.offsetTop;
183     var l = o.offsetLeft;
184     while(o = o.offsetParent)
185     {
186         t += o.offsetTop;
187         l += o.offsetLeft;
188     }
189     var pos = {top:t,left:l};
190     return pos;
191 }
192 
193 function cleanWhitespace(element)
194 {
195   var element = element;
196   for (var i = 0; i < element.childNodes.length; i++) {
197    var node = element.childNodes[i];
198    if (node.nodeType == 3 && !/\S/.test(node.nodeValue))
199      element.removeChild(node);
200    }
201 }
202   </script>
203   <style type="text/css">
204     body, div, input {
205       font: 12px arial;
206     }
207 
208     .calculatorButton {
209         text-align: center;
210         width: 73px;
211     }
212 
213     .calculatorButton2 {
214         text-align: center;
215         width: 154px;
216     }
217     
218     *+html .calculatorButton2  {
219         width: 157px;
220     }
221 
222     #calculator .buttonArea {
223         padding: 3px;
224         border-color: #455690 #a6b4cf #a6b4cf #455690 ;
225         border-style: solid;
226         border-width: 1px;
227     }
228 
229     #calculatorOutput {
230         padding: 2px; border:2px inset; margin: 2px;
231     }
232 
233     #topbar{
234         position:absolute;
235         border-right: #455690 1px solid;
236         border-top: #a6b4cf 1px solid;
237         border-left: #a6b4cf 1px solid;
238         border-bottom: #455690 1px solid;
239         background-color: #c9d3f3;
240         width: 300px;
241         visibility: hidden;
242         z-index: 99999;
243         filter: progid:DXImageTransform.Microsoft.BasicImage(opacity=.65);
244         opacity: 0.65;
245     }
246   </style>
247   <script type="text/javascript">
248   <!--
249   var Calculator = Object();
250 
251   Calculator.result = 0;
252   Calculator.current = '';
253   Calculator.values = 0;
254   Calculator.handle = '';
255 
256   Calculator.elem = function(){ return document.getElementById('calculator'); };
257   Calculator.output = function() { return document.getElementById('calculatorOutput'); }
258 
259   Calculator.input = function(n)
260   {
261     if (n == "."&& Calculator.current.toString().indexOf('.')>=0)
262     {
263       return;
264     }
265     var output = Calculator.output();
266 
267     if (Calculator.current == "0" && n != ".") Calculator.current = '';
268 
269     Calculator.current += "" + n;
270 
271     output.innerHTML = Calculator.current;
272   }
273 
274   Calculator.backspace = function()
275   {
276     var output = Calculator.output();
277     output.innerHTML = output.innerHTML.length > 1 ? output.innerHTML.substr(0, output.innerHTML.length-1) : 0;
278 
279     Calculator.current = output.innerHTML;
280   }
281 
282   Calculator.clear = function()
283   {
284     Calculator.result = 0;
285     Calculator.current = '';
286     Calculator.values = 0;
287     Calculator.handle = '';
288 
289     var output = Calculator.output();
290     output.innerHTML = "0";
291   }
292 
293   Calculator.calculate = function(p)
294   { 
295     if (Calculator.handle != '' && Calculator.values != '' && Calculator.current != '')
296     {
297       try
298       {
299         var value = eval(Calculator.values + Calculator.handle + Calculator.current)
300         Calculator.values = value == 'Infinity' ? 0 : value;
301         Calculator.output().innerHTML  = Calculator.values
302       }
303       catch (e)
304       {
305         alert(e);
306       }
307     }
308     else
309     {
310       Calculator.values = Calculator.current=='' ? Calculator.values : Calculator.current;
311     }
312 
313     if (p == '=')
314     {
315       Calculator.output().innerHTML = Calculator.values == '' ? '0' : Calculator.values;
316       Calculator.current = Calculator.values;
317       Calculator.handle = '';
318     }
319     else
320     {
321       Calculator.handle = p;
322     }
323 
324     Calculator.current = '';
325   }
326 
327   onload = function() {
328     window.focus();
329   }
330   //-->
331   </script>
332 
333 </head>
334 
335 <body style="background:buttonFace">
336     <div class="buttonArea">
337       <div id="calculatorOutput" style="95%; text-align:right;border:2px inset;background:#FFF;">0</div>
338       <table width="100%">
339       <tr>
340         <td colspan="2"><input type="button" class="calculatorButton2" value="初始" onclick="Calculator.clear()" /></td>
341         <td colspan="2"><input type="button" class="calculatorButton2" value="退格" onclick="Calculator.backspace()" /></td>
342       </tr>
343       <tr>
344         <td><input class="calculatorButton" type="button" value="7" onclick="Calculator.input(7)" /></td>
345         <td><input type="button" value="8" class="calculatorButton" onclick="Calculator.input(8)" /></td>
346         <td><input type="button" value="9" class="calculatorButton" onclick="Calculator.input(9)" /></td>
347         <td><input type="button" value="/" class="calculatorButton" onclick="Calculator.calculate('/')" /></td>
348       </tr>
349       <tr>
350         <td><input type="button" value="4" class="calculatorButton" onclick="Calculator.input(4)" /></td>
351         <td><input type="button" value="5" class="calculatorButton" onclick="Calculator.input(5)" /></td>
352         <td><input type="button" value="6" class="calculatorButton" onclick="Calculator.input(6)" /></td>
353         <td><input type="button" value="*" class="calculatorButton" onclick="Calculator.calculate('*')" /></td>
354       </tr>
355       <tr>
356         <td><input type="button" value="1" class="calculatorButton" onclick="Calculator.input(1)" /></td>
357         <td><input type="button" value="2" class="calculatorButton" onclick="Calculator.input(2)" /></td>
358         <td><input type="button" value="3" class="calculatorButton" onclick="Calculator.input(3)" /></td>
359         <td><input type="button" value="-" class="calculatorButton" onclick="Calculator.calculate('-')" /></td>
360       </tr>
361       <tr>
362         <td><input type="button" value="0" class="calculatorButton" onclick="Calculator.input(0)" /></td>
363         <td><input type="button" value="." class="calculatorButton" onclick="Calculator.input('.')" /></td>
364         <td><input type="button" value="=" class="calculatorButton" onclick="Calculator.calculate('=')" /></td>
365         <td><input type="button" value="+" class="calculatorButton" onclick="Calculator.calculate('+')" /></td>
366       </tr>
367       <tr>
368         <td height="38"> </td>
369         <td colspan="2"><div align="center"><a href="#" onclick="top.close()">关闭窗口</a></div></td>
370         <td> </td>
371       </tr>
372       </table>
373     </div>
374 </body>
375 
376 <script type="text/javascript">
377 <!--
378 
379   document.onkeyup = function(e)
380   {
381     var evt = Utils.fixEvent(e);
382 
383     if ((evt.keyCode >= 48 && evt.keyCode <= 57 && !evt.shiftKey) ||
384         (evt.keyCode >= 96 && evt.keyCode <= 105 && !evt.shiftKey))
385     {
386       if (evt.keyCode > 57)
387       {
388         Calculator.input(evt.keyCode - 96);
389       }
390       else
391       {
392         Calculator.input(evt.keyCode - 48);
393       }
394     }
395     else if ((evt.keyCode == 107 && !evt.shiftKey) || (evt.keyCode == 61 && evt.shiftKey) || (evt.keyCode == 187 && evt.shiftKey))
396     {
397       Calculator.calculate('+');
398     }
399     else if ((evt.keyCode == 109 && !evt.shiftKey) || (evt.keyCode == 189 && !evt.shiftKey))
400     {
401       Calculator.calculate('-');
402     }
403     else if ((evt.keyCode == 106 && !evt.shiftKey) || (evt.keyCode == 56 && evt.shiftKey))
404     {
405       Calculator.calculate('*');
406     }
407     else if ((evt.keyCode == 111 && !evt.shiftKey) || (evt.keyCode == 191 && !evt.shiftKey))
408     {
409       Calculator.calculate('/');
410     }
411     else if (evt.keyCode == 13 || (evt.keyCode == 61 && !evt.shiftKey) || (evt.keyCode == 187 && !evt.shiftKey))
412     {
413       Calculator.calculate('=');
414     }
415     else if ((evt.keyCode == 110 && !evt.shiftKey) || (evt.keyCode == 190 && !evt.shiftKey))
416     {
417         Calculator.input('.');
418     }
419     else if (evt.keyCode == 27)
420     {
421       Calculator.clear();
422     }
423     else if (evt.keyCode == 8)
424     {
425       Calculator.backspace();
426     }
427 
428     return false;
429 
430     //alert(evt.keyCode);
431   }
432 //-->
433 </script>
434 </html>