简易计算器

最新推荐文章于 2024-06-23 23:55:57 发布

uwisvgsn

最新推荐文章于 2024-06-23 23:55:57 发布

阅读量62

点赞数 2

分类专栏：笔记文章标签：前端 javascript

本文链接：https://blog.csdn.net/uwisvgsn/article/details/121377444

版权

笔记专栏收录该内容

47 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
      .one{
          margin-left: 200px;
          width: 360px;
          height: 300px;
          background: aquamarine;
      }

    </style>
    <!--<meta http-equiv="refresh" content="1">-->
</head>
<body>

<div class="one" id="time">
    <div>
   <span style="margin-left: 52px"><input type="text" id="t1" style="width: 300px;height: 30px;font-size: 25px;"></span>
   <img src="1.png"style="float: left;width: 60px;height: 60px">
   <h3 style="color: darkgreen;margin-top: 5px;font-size: 35px;text-align: center" > 购物简易计算机</h3>
</div>
    <span style="font-size: 25px"> 第一个数</span><input type="text" id="t2" style="width: 250px;height: 30px;font-size: 30px"><br/>
   <span style="font-size: 25px"> 第二个数</span><input type="text" id="t3"style="width: 250px;height: 30px;font-size: 30px"><br/>
    <input type="button" value="+" id="b1" style="width: 70px;height: 35px;font-size: 25px">
    <input type="button" value="-" id="b2" style="width: 70px;height: 35px;margin-left: 20px;font-size: 25px">
    <input type="button" value="*" id="b3" style="width: 70px;height: 35px;margin-left: 20px;font-size: 25px">
    <input type="button" value="/" id="b4" style="width: 70px;height: 35px;margin-left: 20px;font-size: 25px">

    <span style="font-size: 25px"> 计算结果</span><input type="text" id="t4" style="width: 250px;height: 30px;font-size: 30px">

    <script>
        window.setInterval(function () {
            let data=new Date()
            document.getElementById("t1").value=data.toLocaleString()

        },1)

        document.getElementById("t2").οnblur=function(){
            if((document.getElementById("t2").value=="")){
                document.getElementById("t2").placeholder="第一个数不能为空"
            }else if (isNaN(document.getElementById("t2").value)){
                alert("请输入阿拉伯数字")
            }
        }

            document.getElementById("t3").οnblur=function () {
            if((document.getElementById("t3").value=="")){
                document.getElementById("t3").placeholder="第二个数不能为空"
            }else if(isNaN(document.getElementById("t3").value)){
                alert("请输入阿拉伯数字")
            }
        }




        document.getElementById("b1").οnclick=function() {
            if((document.getElementById("t2").value=="")||(document.getElementById("t3").value=="")){
                document.getElementById("t4").value=""
            }else{
                let a = parseInt(document.getElementById("t2").value)
                let b = parseInt(document.getElementById("t3").value)
                let num1 = a + b;
                document.getElementById("t4").value = num1
            }


      }

      document.getElementById("b2").οnclick=function() {
          if((document.getElementById("t2").value=="")||(document.getElementById("t3").value=="")){
              document.getElementById("t4").value=""
          }else {
              let a = parseInt(document.getElementById("t2").value)
              let b = parseInt(document.getElementById("t3").value)
              let num2 = a - b;
              document.getElementById("t4").value = num2
          }


      }

      document.getElementById("b3").οnclick=function() {
          if((document.getElementById("t2").value=="")||(document.getElementById("t3").value=="")){
              document.getElementById("t4").value=""
          }else {
              let a = parseInt(document.getElementById("t2").value)
              let b = parseInt(document.getElementById("t3").value)
              let num3 = a * b;
              document.getElementById("t4").value = num3
          }


      }

      document.getElementById("b4").οnclick=function(){
          if((document.getElementById("t2").value=="")||(document.getElementById("t3").value=="")){
              document.getElementById("t4").value=""
          }else if (document.getElementById("t3").value==0){
              alert("被除数不能为0")
          }else {
              let a=parseInt(document.getElementById("t2").value)
              let b=parseInt(document.getElementById("t3").value)
              let num4=a/b;
              document.getElementById("t4").value=num4
          }


        }

    </script>
</div>
</body>
</html>

uwisvgsn

关注

2
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
简易计算器

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <style> .one{ margin-left: 200px; width: 360px; height: 300px; backgrou.
复制链接

扫一扫