首页 > 其他 > 详细

简易计算器

时间:2017-04-08 12:18:33      阅读:138      评论:0      收藏:0      [点我收藏+]

实现效果图:

技术分享

代码:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>简易计算器</title>
</head>
<body>
  <input id="txt1" type="text">
  <select id="txt2" name="" id="">
    <option value="+">+</option>
    <option value="-">-</option>
    <option value="*">*</option>
    <option value="/">/</option>
  </select>
  <input id="txt3" type="text">
  <input id="btn" type="button" value="=">
  <input id="txt4" type="text">
  <script>
    var txt1=document.getElementById("txt1");
    var txt2=document.getElementById("txt2");
    var txt3=document.getElementById("txt3");
    var txt4=document.getElementById("txt4");
    var btn=document.getElementById("btn");

    var result=0;// 定义一个变量存放计算器算出的值
    // 点击等号按钮时,算出我们需要的值输出
    btn.onclick=function(){
      var a=parseFloat(txt1.value);
      var b=parseFloat(txt3.value);
      // 在input里面输入的内容是写在value里面的,parseFloat——小数依然适用
      var c=txt2.value;// txt2.value指的是+、-、*、/

      // 利用switch语句完成,当我们选择加减乘除里面其中一个时,符号两边的input里的value值是进行此运算
      switch(c){
        case "+":result=a+b;
        break;
        case "-":result=a-b;
        break;
        case "*":result=a*b;
        break;
        case "/":result=a/b;
        break;
      }
      // 将算出来的值赋到等号后面的input的里面输出
       txt4.value=result;

    }
  </script>
</body>
</html>

简易计算器

原文:http://www.cnblogs.com/www-cqtblogs-com/p/6681403.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!