002计算器

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>计算器</title>
    <script>
        function sum() {
            var a = document.getElementById("a").value;
            var b = document.getElementById("b").value;
            var r = document.getElementById("sum");
            var v = document.getElementById("sym").value;

            eval("var s="+";r.value=a s b");
            eval("var sum=0; r.value=a+b");
            eval("r.value=a+b");
        }
    </script>
</head>
<body>
<input type="text" id="a">
<select name="" id="sym">
    <option value="+">+</option>
    <option value="-">-</option>
    <option value="*">*</option>
    <option value="/">/</option>
</select>
<input type="text" id="b">=
<input type="text" id="sum">
<button οnclick="sum();">计算</button>
</body>
</html>

----------------------------------------------------------------------------------------------------------------------------------
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>计算器简版</title>
</head>
<script>
    function myfun() {
        var a=document.getElementById("a").value;
        var b=document.getElementById("b").value;
        //获取操作符的值
        var sym=document.getElementById("sym").value;
        var r=document.getElementById("r");
        //定义一个变量来存放计算的结果
/*     var temp=0;
       if(sym=="+"){
            temp=Number(a)+Number(b);
        }
        //获取input对象并给对象value的属性赋值
        var rObj=document.getElementById("r");
        rObj.value=temp;
        */
        r.value=eval(a+sym+b);  /*eval将字符串转换为JS代码*/
    }
</script>
<body>
<input type="text" id="a">
<select name="" id="sym">
    <option value="+">加</option>
    <option value="-">减</option>
    <option value="*">乘</option>
    <option value="/">除</option>
</select>
<input type="text" id="b">=
<input type="text" id="r"  οnclick="myfun();" >
</body>
</html>

----------------------------------------------------------------------------------------------------------------------------------
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Table</title>
    <style>
        table {
            width: 232px;
            height: 320px;
        }

        td {
            width: 58px;
            height: 60px;
            background: #e0e0e0;
            text-align: center;
        }

        td:last-child {
            background: #f79331;
            color: #fff;
        }

        div {
            width: 232px;
            height: 80px;
            border: none;
            text-align: right;
            background: #636363;
            color: #fff;
            font-size: 50px;
            line-height: 80px;
            overflow: hidden;
        }
    </style>
</head>
<body>
<div id="r">0</div>
<table onClick="calculater()">
    <tr>
        <td οnclick="chongzhi()">AC</td>
        <td>+/-</td>
        <td>%</td>
        <td>/</td>
    </tr>
    <tr>
        <td>7</td>
        <td>8</td>
        <td>9</td>
        <td>*</td>
    </tr>
    <tr>
        <td>4</td>
        <td>5</td>
        <td>6</td>
        <td>-</td>
    </tr>
    <tr>
        <td>1</td>
        <td>2</td>
        <td>3</td>
        <td>+</td>
    </tr>
    <tr>
        <td colspan="2">0</td>
        <td>.</td>
        <td οnclick="resultscalcaulte()">=</td>
    </tr>
</table>
<script>

    var results = "";
    var calresults = "";

    function chongzhi() {

    }
    function calculater() {
        if (event.srcElement.innerText == "=") {
            return ;
        }
        results += event.srcElement.innerText;
        r.innerText = results;
        // 重置计算器
        if(event.srcElement.innerText =="AC"){
            document.getElementById('r').innerHTML='0';
            results="";
        }
    }
    function resultscalcaulte() {
        calresults = eval(results);
        r.innerText = calresults;
    }
    document.getElementById('r').innerHTML='0';

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

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值