亚洲乱码中文字幕综合,中国熟女仑乱hd,亚洲精品乱拍国产一区二区三区,一本大道卡一卡二卡三乱码全集资源,又粗又黄又硬又爽的免费视频

簡(jiǎn)易js代碼實(shí)現(xiàn)計(jì)算器操作

 更新時(shí)間:2013年04月15日 17:41:05   投稿:jingxian  
正在學(xué)習(xí)javascript的朋友們,可以把這個(gè)小練習(xí)做一做,加強(qiáng)自己編寫(xiě)代碼的能力

復(fù)制代碼 代碼如下:

<html>
<head>
<title>JS版計(jì)算器</title>
<link rel="stylesheet" type="text/css" href="">
<meta http-equiv="content-type" content="text/html;charset=utf-8">
<!--js代碼可以放置在任意位置,按照先后順序依次執(zhí)行 一般放在head標(biāo)簽之間-->
<script type="text/javascript">

    /* 定義一個(gè)Calculator類(lèi)*/
    function Calculator(){
       
        this.jisuan=function(num1,num2,oper){
            var res=0;
            switch(oper){
                case "+":
                    res=num1+num2;
                    break;
                case "-":
                    res=num1-num2;
                    break;
                case "*":
                    res=num1*num2;
                    break;
                case "/":
                    res=num1/num2;
                    break;
            }
            return res;
        }
    }
    //創(chuàng)建對(duì)象
    var calculator=new Calculator();

    /*定義全局變量*/
    var val=0; //放置輸入的值
    var xval=0;//保存轉(zhuǎn)換Number類(lèi)型的值
    var temp=0; //保存第一次輸入的值   
    var oper="";//保存輸入的操作符

    /*獲取輸入數(shù)字*/
    function inputEvent(e){
   
        val=e.value
        var xsval=document.getElementById("inp1");       
        xsval.value+=val; //連續(xù)輸入數(shù)字(String類(lèi)型)
        //轉(zhuǎn)換Number類(lèi)型
        xval=parseFloat(xsval.value);
       
    }

    /*獲取第一行的數(shù)據(jù)*/
    function inputPCB(e){
        //window.alert(e.value);
        var xsval=document.getElementById("inp1");
        if(e.value=="Clear"){
            xsval.value="";
        }else if(e.value=="Back"){
            /*這個(gè)功能還沒(méi)有實(shí)現(xiàn),有興趣的朋友可以自己做一做*/

        }else if(e.value=="POWER"){
            //計(jì)算平方
            xsval.value=Math.pow(xsval.value,2);           
        }
    }

    /*輸入操作符*/
    function inputOper(e){

        oper=e.value;
        //window.alert(typeof oper);
        //oper=oper.substr(0);
        if (e.value=="+"){
            var xsval=document.getElementById("inp1");
            //保存上次計(jì)算結(jié)果,并對(duì)字符串進(jìn)行轉(zhuǎn)換Number類(lèi)型
            temp=parseFloat(xsval.value);
            //第一次輸入的值設(shè)置為空
            xsval.value="";                       
        }else if(e.value=="-"){
            var xsval=document.getElementById("inp1");
            temp=parseFloat(xsval.value);
            xsval.value="";
        }else if(e.value=="*"){
            var xsval=document.getElementById("inp1");
            temp=parseFloat(xsval.value);
            xsval.value="";
        }else if(e.value=="/"){
            var xsval=document.getElementById("inp1");
            temp=parseFloat(xsval.value);
            xsval.value="";
        }
    }

    /*計(jì)算結(jié)果*/
    function inputEquel(e){

        var xsval=document.getElementById("inp1");       
        if(e.value=="="){
            //window.alert(xval);
            //調(diào)用對(duì)象方法
            xsval.value=calculator.jisuan(temp,xval,oper);
        }
    }
</script>
<!--css 樣式-->
<style>
    input{
        width:60px;
    }
    #inp1{
        width:280px;
        text-align:right;
    }
</style>
</head>
<body>
    <table border="1">
        <!--顯示結(jié)果行-->
        <tr><td colspan="4"><input id="inp1" type="text" value="" name="xianshi"/></td></tr>
       
        <!--第一行-->
        <tr><td><input type="button" value="POWER" onclick="inputPCB(this)"/></td><td><input type="button" value="Clear" onclick="inputPCB(this)"/></td><td><input type="button" value="Back"onclick="inputPCB(this)"/></td><td></td></tr>
        <!--第二行-->
        <tr><td><input type="button" value="1" onclick="inputEvent(this)"/></td><td><input type="button" value="2" onclick="inputEvent(this)"/></td><td><input type="button"value="3" onclick="inputEvent(this)"/></td><td><input type="button" value="4" onclick="inputEvent(this)"/></td></tr>
        <!--第三行-->
        <tr><td><input type="button" value="5" onclick="inputEvent(this)"/></td><td><input type="button" value="6" onclick="inputEvent(this)"/></td><td><input type="button"value="7" onclick="inputEvent(this)"/></td><td><input type="button" value="8" onclick="inputEvent(this)"/></td></tr>   
        <!--第四行-->
        <tr><td><input type="button" value="9" onclick="inputEvent(this)"/></td><td><input type="button" value="0" onclick="inputEvent(this)"/></td><td><input type="button"value="." onclick="inputEvent(this)"/></td><td><input type="button" value="=" onclick="inputEquel(this)"/></td></tr>
        <!--第五行-->
        <tr><td><input type="button" value="+" onclick="inputOper(this)"/></td><td><input type="button" value="-" onclick="inputOper(this)"/></td><td><input type="button"value="*" onclick="inputOper(this)"/></td><td><input type="button" value="/" onclick="inputOper(this)"/></td></tr>   
   
    </table>
</body>
</html>

PS:這里再為大家推薦兩款本站的在線(xiàn)計(jì)算器,都是采用js實(shí)現(xiàn),且功能強(qiáng)大,相信對(duì)于大家深入了解JavaScript數(shù)學(xué)運(yùn)算及web設(shè)計(jì)會(huì)有所幫助:

在線(xiàn)標(biāo)準(zhǔn)計(jì)算器:http://tools.jb51.net/jisuanqi/jsq

在線(xiàn)科學(xué)計(jì)算器:http://tools.jb51.net/jisuanqi/jsqkexue

相關(guān)文章

  • javascript七大數(shù)據(jù)類(lèi)型詳解

    javascript七大數(shù)據(jù)類(lèi)型詳解

    這篇文章主要為大家介紹了 javascript七大數(shù)據(jù)類(lèi)型,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下,希望能夠給你帶來(lái)幫助
    2021-12-12
  • Javascript & DHTML 實(shí)例編程(教程)DOM基礎(chǔ)和基本API

    Javascript & DHTML 實(shí)例編程(教程)DOM基礎(chǔ)和基本API

    Javascript & DHTML 實(shí)例編程(教程)DOM基礎(chǔ)和基本API...
    2007-06-06
  • Javascript基礎(chǔ):運(yùn)算符與流程控制詳解

    Javascript基礎(chǔ):運(yùn)算符與流程控制詳解

    這篇文章主要給大家介紹了關(guān)于Javascript中運(yùn)算符及流程控制的相關(guān)資料,文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧
    2021-10-10
  • 老生常談JavaScript數(shù)組的用法

    老生常談JavaScript數(shù)組的用法

    下面小編就為大家?guī)?lái)一篇老生常談JavaScript數(shù)組的用法。小編覺(jué)得挺不錯(cuò)的,現(xiàn)在就分享給大家,也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧
    2016-06-06
  • javascript中怎么做對(duì)象的類(lèi)型判斷

    javascript中怎么做對(duì)象的類(lèi)型判斷

    javascript中經(jīng)常使用的對(duì)象判斷方式包括:typeof、constructor和Object.prototype.toString.call()
    2013-11-11
  • JavaScript中var關(guān)鍵字的使用詳解

    JavaScript中var關(guān)鍵字的使用詳解

    這篇文章主要介紹了JavaScript中var關(guān)鍵字的使用,是JavaScript入門(mén)學(xué)習(xí)中的基礎(chǔ)知識(shí),需要的朋友可以參考下
    2015-08-08
  • 詳解JavaScript 為什么要有 Symbol 類(lèi)型?

    詳解JavaScript 為什么要有 Symbol 類(lèi)型?

    這篇文章主要介紹了JavaScript 為什么要有 Symbol 類(lèi)型,文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧
    2019-04-04
  • 大型JavaScript應(yīng)用程序架構(gòu)設(shè)計(jì)模式

    大型JavaScript應(yīng)用程序架構(gòu)設(shè)計(jì)模式

    11月中旬在倫敦舉行的jQuery Summit頂級(jí)大會(huì)上有個(gè)session講的是大型JavaScript應(yīng)用程序架構(gòu),看完P(guān)PT以后覺(jué)得甚是不錯(cuò),于是整理一下發(fā)給大家共勉。
    2016-06-06
  • document.getElementById獲取控件對(duì)象為空的解決方法

    document.getElementById獲取控件對(duì)象為空的解決方法

    今天寫(xiě)個(gè)網(wǎng)頁(yè),想在頁(yè)面加載onLoad時(shí),動(dòng)態(tài)顯示由后臺(tái)其他程序傳來(lái)的數(shù)據(jù)時(shí),用document.getElementById獲取控件對(duì)象總是為空。但是檢查了這個(gè)id確實(shí)是存在的??聪挛牡氖纠徒鉀Q方法
    2013-11-11
  • 關(guān)于IE BUG與字符串截取substr的解決辦法

    關(guān)于IE BUG與字符串截取substr的解決辦法

    本篇文章小編為大家介紹一下,關(guān)于IE BUG與字符串截取substr的解決辦法,有需要的朋友可以參考一下
    2013-04-04

最新評(píng)論