制作简易淘宝计算器
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>
感觉还是挺好玩的