js计算器

界面:

index.html:

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>js计算器</title>
<link href="css/style.css" rel="stylesheet" type="text/css" />
<link href="css/reset.css" rel="stylesheet" type="text/css" />
<script src="js/a.js" type="text/javascript"></script>
</head>
<body>
<div id="count">
<textarea readonly="readonly"></textarea>
<input type="button" value="←">
<input type="button" value="CE">
<input type="button" value="C">
<input type="button" value="±">
<input type="button" value="√">
<br />
<input type="button" value="7">
<input type="button" value="8">
<input type="button" value="9">
<input type="button" value="÷">
<input type="button" value="%">
<br />
<input type="button" value="4">
<input type="button" value="5">
<input type="button" value="6">
<input type="button" value="*">
<input type="button" value="1/x">
<br />
<input type="button" value="1">
<input type="button" value="2">
<input type="button" value="3">
<input type="button" value="-">
<input type="button" value="=" class="result">
<br />
<input type="button" value="0" style="width:85px;">
<input type="button" value=".">
<input type="button" value="+">
<br />
</div>
</body>
</html>

a.js:

var show="";            /*用于文本域的显示*/
var x="";               /*输入值*/
var a=0;                /*数值暂存*/
var fh="";              /*运算符*/
var yn=false;           /*文本域是否需要清零*/
window.onload=dy;
function dy(){
    var count=document.getElementById("count");
    var count_input=count.getElementsByTagName("input");
    for(var i=0;i<count_input.length;i++){
        count_input[i].onclick=function(){
            press(event);
        }
    }
}
function press(e){                  /*主函数*/
    var txt=document.getElementsByTagName("textarea")[0];
    var e=e.target.value;
    if(e>=0&&e<=9) sz(e);
    if(e>=0&&e<=9&&yn==true) sz1(e);
    if(e=="←") bback();
    if(e=="CE") del();
    if(e=="C") ql();
    if(e=="+") sum();
    if(e=="-") subtraction();
    if(e=="*") multiplication();
    if(e=="÷") division();
    if(e=="=") show=results(e);
    if(e==".") decimals();
    if(e=="±") plusMinus();
    if(e=="√") radical();
    if(e=="1/x") reciprocal();
    txt.value=show;
}
function sz(e){                     /*字符相连成变量x*/
    x=x+e;
    show=show+e;
}
function sz1(e){                    /*输出结果后直接输入数字,显示归零*/
    show=e;
    x=e;
    yn=false;
}
function decimals(){                /*小数点相连*/
    if(x.lastIndexOf(".")!==1){
    x=x+".";
    show=show+".";
    }
}
function bback(){                   /*后退*/
    show=show.substring(0,show.length-1);
    x=x.substring(0,x.length-1);
}
function ql(){                      /*所有归零*/
    x="";
    a="";
    show="";
}                                   /*删除右操作数*/
function del(){
    show=show.substring(0,show.length-x.length);
    x="";
}
function sum(){                     /*求和*/
    if(a!=""){
        show=results();
        x=Number(a)+Number(x);
        show=x;
        a="";
        yn=true;
    }
    else{
        yn=false;
        a=x;
        x="";
        fh="+";
        show=show+"+";
    }
}
function subtraction(){                     /*求减*/
    if(a!=""){
        show=results();
        show=x;
        a="";
        yn=true;
    }
    else{
        yn=false;
        a=x;
        x="";
        fh="-";
        show=show+"-";
    }
}
function multiplication(){                      /*乘法*/
    if(a!=""&&x!=""){
        show=results();
        a="";
        yn=true;
    }
    else{
        yn=false;
        a=x;
        x="";
        fh="*";
        show=show+"*";
    }
}
function division(){                        /*除法*/
    if(a!=""){
        if(x==0) show="除数不能为0";
        else{
            show=results();
            show=x;
            a="";
            yn=true;
        }
    }
    else{
        yn=false;
        a=x;
        x="";
        fh="÷";
        show=show+"÷";
    }
}
function radical(){                     /*根号*/
    if(a!="") show=results();
    show=Math.sqrt(show);
    x=Math.sqrt(x);
}
function reciprocal(){                  /*倒数*/
    if(a!=""){
        show=results();
        show=1/x;
        x=1/x;
    }
    else{
        if(x==0) show="除数不能为0";
        else{
        x=1/x;
        show=x;
        yn=true;
        }
    }
}
function results(){                 /*输出结果*/
    if(fh=="+") x=Number(a)+Number(x);
    if(fh=="-") x=Number(a)-Number(x);
    if(fh=="*") x=Number(a)*Number(x);
    if(fh=="÷"){
        if(x==0){
            x="除数不能为0";
        }
        else
            x=Number(a)/Number(x);
    } 
    yn=true;
    a="";
    return x;
}
function plusMinus(){               /*正负数转换*/
    if(a!="") show=results();
    show=show*-1;
    x=x*-1;
}

style.css:

body{
    text-align:center;
}
#count{
    margin:10px auto;
    text-align:center;
    font:12px "微软雅黑";
    width:225px;
}
#count textarea{
    margin:0 auto;
    width:210px;
    height:50px;
    display:block;
    margin-bottom:5px;
}
#count input{
    width:40px;
    height:25px;
    cursor:pointer;
}
#count input.result{
    float:right;
    height:50px;
    margin-right:5px;
}

这是我做的第一个javascript dom网页,水平低低、冗余多多,望批评指正。

在线地址:http://runjs.cn/code/mkvphtez

posted @ 2012-10-16 14:02  前端小尚  阅读(427)  评论(0编辑  收藏  举报