首页 > 代码库 > HTML练习（网页计算器）
HTML练习（网页计算器）
1 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 2 <html> 3 <head> 4 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 5 <title>Insert title here</title> 6 <script> 7 var str; 8 var num; 9 function count(ch)10 {11 str=document.getElementById("show");12 if(ch=="C")13 {14 str.value="0"; 15 }16 else if(ch=="←")17 {18 str.value=str.value.substr(0,str.value.length-1);19 if(str.value.length==0)20 str.value="0";21 }22 else if(ch==‘%‘&&str.value=="0")23 {24 ;25 }26 else27 {28 if(str.value=="0")29 str.value="";30 str.value=str.value+ch;31 }32 }33 function ans()34 {35 str=document.getElementById("show");36 num=eval(str.value);37 str.value=num;38 }39 </script>40 </head>41 <body>42 <form action="" name="cal">43 <h1 align="center" style="color:#FF00FF;">计算器</h1>44 <p align="center"> <input type="text" id="show" value="0" style="text-align: right;width: 250px; height: 30px;color:#0000FF;"></input></p>45 <p align="center"> <input type="button" name="cal_cle" value="C" style="width: 70px; height: 30px;font-size:20px;" onClick="count(‘C‘)"></input>46 <input type="button" name="cal_pre" value="←" style="width: 70px; height: 30px;font-size:20px;" onClick="count(‘←‘)"></input>47 <input type="button" name="cal_pre" value="%" style="width: 70px; height: 30px;font-size:20px;" onClick="count(‘%‘)"></input>48 </p>49 <p align="center"> <input type="button" name="cal_1" value="1" style="width: 50px; height: 30px;font-size:20px;" onClick="count(1)"></input>50 <input type="button" name="cal_2" value="2" style="width: 50px; height: 30px;font-size:20px;" onClick="count(2)"></input>51 <input type="button" name="cal_3" value="3" style="width: 50px; height: 30px;font-size:20px;" onClick="count(3)"></input>52 <input type="button" name="cal_mul" value="*" style="width: 50px; height: 30px;font-size:20px;" onClick="count(‘*‘)"></input>53 </p>54 <p align="center"> <input type="button" name="cal_4" value="4" style="width: 50px; height: 30px;font-size:20px;" onClick="count(4)"></input>55 <input type="button" name="cal_5" value="5" style="width: 50px; height: 30px;font-size:20px;" onClick="count(5)"></input>56 <input type="button" name="cal_6" value="6" style="width: 50px; height: 30px;font-size:20px;" onClick="count(6)"></input>57 <input type="button" name="cal_div" value="/" style="width: 50px; height: 30px;font-size:20px;" onClick="count(‘/‘)"></input>58 </p>59 <p align="center"> <input type="button" name="cal_7" value="7" style="width: 50px; height: 30px;font-size:20px;" onClick="count(7)"></input>60 <input type="button" name="cal_8" value="8" style="width: 50px; height: 30px;font-size:20px;" onClick="count(8)"></input>61 <input type="button" name="cal_9" value="9" style="width: 50px; height: 30px;font-size:20px;" onClick="count(9)"></input>62 <input type="button" name="cal_add" value="+" style="width: 50px; height: 30px;font-size:20px;" onClick="count(‘+‘)"></input>63 </p>64 <p align="center"> <input type="button" name="cal_0" value="0" style="width: 50px; height: 30px;font-size:20px;" onClick="count(0)"></input>65 <input type="button" name="cal_dot" value="." style="width: 50px; height: 30px;font-size:20px;" onClick="count(‘.‘)"></input>66 <input type="button" name="cal_equ" value="=" style="width: 50px; height: 30px;font-size:20px;" onClick="ans()"></input>67 <input type="button" name="cal_sub" value="-" style="width: 50px; height: 30px;font-size:20px;" onClick="count(‘-‘)"></input>68 </p>69 </form>70 </body>71 </html>
HTML练习（网页计算器）
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。