制作简易淘宝计算器

2015-03-2613:18:47

 1 <!doctype html>
 2 <html lang="en">
 3  <head>
 4   <meta charset="UTF-8">
 5   <meta name="Generator" content="EditPlus®">
 6   <meta name="Author" content="">
 7   <meta name="Keywords" content="">
 8   <meta name="Description" content="">
 9   <title>Document</title>
10   <style>
11   section{
12     background-color:#C9E495;
13     width:260px;
14     height:320px;
15     text-align:center;
16     padding-top:1px;
17   }
18 
19   .textborder{
20   border-width:1px;
21   border-style:solid;
22   }
23   </style>
24   <script language='javascript'>
25   function compute(re){
26       var num1,num2;
27       num1=parseFloat(document.Shopping.textnum1.value);
28       num2=parseFloat(document.Shopping.textnum2.value);
29       if(re=='+'){
30         document.Shopping.textresult.value=num1+num2;
31       }else if(re=='-'){
32         document.Shopping.textresult.value=num1-num2;
33       }else if(re=='×'){
34         document.Shopping.textresult.value=num1*num2;
35       }
36       else if(re=='÷'&&num2!=0){
37         document.Shopping.textresult.value=num1/num2;
38       }
39   }
40   </script>
41  </head>
42  <body>
43   <section>
44   <h1><img src='images/logo.gif' width='240px',height='31px'>欢迎您来淘宝</h1>
45   <form action='' mothod='post' name='Shopping'>
46     <h3><img src='images/shop.gif'>购物简易计算器</h3>
47     <p>第一个数:<input type='text' name='textnum1' class='textBaroder' id='textnum1' size='20'/></p>
48     <p>第二个数:<input type='text' name='textnum2' class='textBaroder' id='textnum2' size='20'/></p>
49     <p>
50     <input type='button' name='addbutton' id='addbutton' value='+' onclick='compute("+")'/>
51     <input type='button' name='subbutton' id='subbutton' value='-' onclick='compute("-")'/>
52     <input type='button' name='mulbutton' id='mulbutton' value='×' onclick='compute("×")'/>
53     <input type='button' name='divbutton' id='divbutton' value='÷' onclick='compute("÷")'/>
54     </p>
55     <p>计算结果:<input type='text' name='textresult' id='textresult' class='textborder' size='20'/></p>
56   </form>
57   </section>
58  </body>
59 </html>

感觉还是挺好玩的

 

posted @ 2015-03-26 13:22  积极进取的韭菜  Views(559)  Comments(0Edit  收藏  举报