简单的计算器编码

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <script type="text/javascript" src="../Scripts/jquery-1.8.2.min.js"></script>
    <script type="text/javascript" src="../Scripts/data.js"></script>
    <script type="text/javascript" src="../Scripts/common.js"></script>
    <title>计算器</title>
    <style type="text/css">
        body {
            width: 100%;
            height: 100%;
            font-family: Microsoft YaHe;
            font-size: 11px;
        }


        label {
            font-family: Microsoft YaHe;
            font-size: 12px;
        }


        input[type="button"] {
            width: 100%;
            height: 100%;
            border: 0px;
            background-color: #0A78FF;
            background-image: url(1.png);
            background-repeat: repeat-x;
        }


            input[type="button"]:hover {
                background-image: url(1s.png);
            }


        #zero {
            width: 100%;
            height: 100%;
        }


        #equre {
            width: 100%;
            height: 100%;
            background-image: url(2.png);
        }


            #equre:hover {
                background-image: url(2s.png);
            }


        td {
            border: 1px gray solid;
        }


        .inner td {
            border: 0px;
            width: 46px;
        }
    </style>
</head>
<body>
    <table id="er" style="background-color: #0A78FF;">
        <tr>
            <td colspan="9" style="height:50px;text-align:right;vertical-align:bottom">
                <input type="txet" id="inp1" style="width: 400px; height: 50px;" disabled />
            </td>
        </tr>
        <tr>
            <td colspan="9">
                <table class="inner" frame="void" rules="none">
                    <tr>
                        <td colspan="1">0000</td>
                        <td>0000</td>
                        <td>0000</td>
                        <td>0000</td>
                        <td>0000</td>
                        <td>0000</td>
                        <td>0000</td>
                        <td>0000</td>
                    </tr>
                    <tr>
                        <td colspan="4">63</td>
                        <td colspan="3">47</td>
                        <td>32</td>
                    </tr>
                    <tr>
                        <td>0000</td>
                        <td>0000</td>
                        <td>0000</td>
                        <td>0000</td>
                        <td>0000</td>
                        <td>0000</td>
                        <td>0000</td>
                        <td>0000</td>
                    </tr>
                    <tr>
                        <td colspan="4">31</td>
                        <td colspan="3">15</td>
                        <td>0</td>
                    </tr>
                </table>
            </td>
        </tr>
        <tr>
            <td rowspan="3">
                <input type="radio" name="jinzhi" id="shiliu"/><label>十六进制</label><br />
                <input type="radio" name="jinzhi" checked="checked"/><label>十进制</label><br />
                <input type="radio" name="jinzhi" id="ba"/><label>八进制</label><br />
                <input type="radio" name="jinzhi" id="er"/><label>二进制</label>
            </td>
            <td></td>
            <td><input type="button" value="Mod" /></td>
            <td><input type="button" value="A" /></td>
            <td><input type="button" value="MC"/></td>
            <td><input type="button" value="MR" /></td>
            <td><input type="button" value="MS" /></td>
            <td><input type="button" value="M+" /></td>
            <td><input type="button" value="M-" /></td>
        </tr>
        <tr>
            <td><input type="button" value="(" οnclick="yi(this)"/></td>
            <td><input type="button" value=")"οnclick="yi(this)" /></td>
            <td><input type="button" value="B" /></td>
            <td><input type="button" value="←" /></td>
            <td><input type="button" value="CE" οnclick="qingchua()"/></td>
            <td><input type="button" value="C" /></td>
            <td><input type="button" value="+/-" /></td>
            <td><input type="button" value="√" /></td>
        </tr>
        <tr>
            <td><input type="button" value="RoL" /></td>
            <td><input type="button" value="RoR" /></td>
            <td><input type="button" value="C" /></td>
            <td><input type="button" value="7" οnclick="yi(this)"/></td>
            <td><input type="button" value="8" οnclick="yi(this)"/></td>
            <td><input type="button" value="9" οnclick="yi(this)"/></td>
            <td><input type="button" value="/" οnclick="yi(this)"/></td>
            <td><input type="button" value="%" /></td>
        </tr>
        <tr>
            <td rowspan="3">
                <input type="radio" name="zi" checked="checked"/><label>四字</label><br />
                <input type="radio" name="zi" /><label>双字</label><br />
                <input type="radio" name="zi" /><label>字</label><br />
                <input type="radio" name="zi" /><label>字节</label>
            </td>
            <td><input type="button" value="Or" /></td>
            <td><input type="button" value="Xor" /></td>
            <td><input type="button" value="D" /></td>
            <td><input type="button" value="4" οnclick="yi(this)" /></td>
            <td><input type="button" value="5" οnclick="yi(this)" /></td>
            <td><input type="button" value="6" οnclick="yi(this)"/></td>
            <td><input type="button" value="*" οnclick="yi(this)"/></td>
            <td><input type="button" value="1/x" /></td>
        </tr>
        <tr>
            <td><input type="button" value="Lsh" /></td>
            <td><input type="button" value="Rsh" /></td>
            <td><input type="button" value="E" /></td>
            <td><input type="button" value="1" οnclick="yi(this)"/></td>
            <td><input type="button" value="2" οnclick="yi(this)"/></td>
            <td><input type="button" value="3" οnclick="yi(this)"/></td>
            <td><input type="button" value="-" οnclick="yi(this)"/></td>
            <td rowspan="2"><input type="button" id="equre" value="=" οnclick="jieguo()"/></td>
        </tr>
        <tr>
            <td><input type="button" value="Not" /></td>
            <td><input type="button" value="And" /></td>
            <td><input type="button" value="F" /></td>
            <td colspan="2"><input id="zero" type="button" value="0" οnclick="yi(this)"/></td>
            <td><input type="button" value="." οnclick="yi(this)" /></td>
            <td><input type="button" value="+" οnclick="yi(this)"/></td>
        </tr>
    </table>
    <script type="text/javascript">
        function yi(r) {
            //r是input r.value 取值
            //var val= r.value;
            //id的数据=ID数据拼接参数的数据
            inp1.value = inp1.value + r.value;
            //id 定到 文本
            //var f = document.getElementById("inp1");
            //f.value 旧值 加上 r.value 取值 等于f.value
            //f.value = f.value + val;
        }
        function jieguo() {
            //id 定到 文本 取值
            var shuju = document.getElementById("inp1").value;
            //str 等于 文本值
            var str = shuju;
            //调用calc
            alert(calc(str));
        }
        function calc(expr) {
            //在函数calc内查找expr第一个右括号")";
            var xiabiao1 = expr.indexOf(")");
            if (xiabiao1 == -1) {
                return calcout(expr);
            }
            //找到expr第一个右括号前面紧临的左括号"(";
            //找到 第一个右括号 前面 紧临
            var xiabiao2 = expr.lastIndexOf("(", xiabiao1);
            //声明一个变量subexpr,截取右括号和左括号找到括号中间的字符串并赋值给subexpr
            var subexpr = expr.substring(xiabiao2 + 1, xiabiao1);
            var l = expr.substring(0, xiabiao2);//截取左括号之前的数
            //调用
            var m = calcout(subexpr);//括号里的数
            var r = expr.substring(xiabiao1 + 1);//截取右括号之后的数
            return calc(l + m + r);//拼接式子
        }
        function isNum(cr) {
            return "0123456789".indexOf(cr) > -1;
        }
        //bijiao  比较符号的优先级
        function bijiao(bijiao1, bijiao2) {
            if (bijiao1 == -1) {
                return bijiao2;
            }
            if (bijiao2 == -1) {
                return bijiao1;
            }
            if (bijiao1 > bijiao2) {
                return bijiao2;
            } else {
                return bijiao1;
            }
        }
        //声明一个函数calcout,接收一个参数expr2,调用calcout;
        function calcout(expr2) {
            //在calcout内,查找expr2中的符号"*","/"如果没有就查找符号"+","-"
            var index =bijiao(expr2.indexOf("*"),expr2.indexOf("/"));//查找expr2中的符号"*"
            if(index == -1) {
                index =bijiao(expr2.indexOf("+"),expr2.indexOf("-"));//就查找符号"+"
            }if (index == -1) {
                //return expr2;
                var f = document.getElementById("inp1").value = "";
                var w = document.getElementById("inp1");
                w.value = expr2;
                if (expr2 == "NaN") {
                    w.value = 0;
                    return 0;
                }
                return (expr2);
            }
            //查找字符串中的乘号除号,加号减号,取出加号前面和后面的数字
            var num1 = "";
            var i = index - 1;
            for (; i >= 0; i--) {//循环
                var numi = expr2.charAt(i);
                if (isNum(numi) || "." == numi) {
                    num1 = numi + num1;// isNum 返回继续循环 或 遇见小数点计算
                    continue;
                }
                break;
            }
            i++;
            var num2 = "";
            var j = index + 1;
            for (; j < expr2.length; j++) {//循环
                var numi = expr2.charAt(j);
                if (isNum(numi) || "." == numi) {
                    num2 = num2 + numi;// isNum 返回继续循环 或 遇见小数点计算
                    continue;
                }
                break;
            }
            
            var newnum = calc2(num1 - 0, expr2.charAt(index), num2 - 0);//调用 计算
            return calcout(expr2.substring(0, i) + newnum + expr2.substring(j));//calcout


        }
        //新建一个函数,有3个参数,分别是num1,calc,num2。num1和num2是数字,calc是符号,有可能的符号包括+-*/,根据calc不同分别返回num1和num2的和差积商。
        function calc2(num1, calc, num2) {
            if (calc == "+") {
                return num1 + num2;
            }
            else if (calc == "-") {
                return num1 - num2;
            }
            else if (calc == "*") {
                return num1 * num2;
            }
            else if (calc == "/") {
                return num1 / num2;
            }
            return 0;
        }
        function qingchua() {
            var qc = document.getElementById("inp1").value="";
        }
    </script>
</body>
</html>
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值