码迷,mamicode.com
首页 > Web开发 > 详细

JS实现的简单计算器

时间:2016-09-22 10:05:59      阅读:158      评论:0      收藏:0      [点我收藏+]

标签:

 1 <!DOCTYPE html>
 2 <html>
 3     <head>
 4         <meta charset="UTF-8">
 5         <title>计算器</title>
 6     </head>
 7     <body>
 8         <input type="text" name="" id="a" placeholder="请输入一个数" />
 9         <select name=""id="b">
10             <option value="1">+</option>
11             <option value="2">-</option>
12             <option value="3">*</option>
13             <option value="4">/</option>
14             <option value="5">%</option>
15         </select>
16         <input type="text" id="c" placeholder="请输入一个数" //>
17         =<input type="text" id="p"/>
18         <input type="button" id="d" value="计算" />
19         <script type="text/javascript">
20                 var e=document.getElementById(d);
21                 e.onclick = function(aaa){
22                 var m = document.getElementById(a).value;
23                 var x = document.getElementById(b).value;
24                 var n = document.getElementById(c).value;
25                 var y = document.getElementById(p);
26 //                alert(m);
27 //                alert(x);
28 //                alert(n);
29                 if(Number(x)==1){
30                      y.value=Number(m)+Number(n);
31                 }
32                 else if(Number(x)==2){
33                     y.value=Number(m)-Number(n);
34                 }
35                 else if(Number(x)==3){
36                     y.value=Number(m)*Number(n);
37                 }
38                 else if(Number(x)==4){
39                     y.value=Number(m)/Number(n);
40                 }
41                 else if(Number(x)==5){
42                     y.value=Number(m)%Number(n);
43                 }
44                 }                
45         </script>
46     </body>
47 </html>

 

JS实现的简单计算器

标签:

原文地址:http://www.cnblogs.com/studyhtml5/p/5894924.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!