您正在使用IPV4(35.153.166.111)访问本站 您本次共访问本站 1 次
 用户名: 密 码: 验证码:     用QQ登录本站
首页 软件 编程 笑话 知识 公告 台风 日历 计算器 行情 简化版
文明驾车我带头,文明行路我带头,礼貌让座我带头      

【腾讯云】云产品限时秒杀,爆款1核2G云服务器,首年74元       [公益] 节省一分零钱 献出一份爱心 温暖世间真情      
虚位以待
2021年 冬至节 14
2021年 圣诞节 18
2022年 元 旦 25
2022年 春 节 56
 
  • 本类新增
    本类热门文章
    您现在的位置:首页 >> JS/CSS >> 内容
    利用JavaScript写一个简单计算器
    内容摘要: !DOCTYPEhtmlhtmllang='en'headmetacharset='UTF-8'metahttp-equiv='X-UA-Compatible'content='IE=edge'metaname='viewport'content='width=device-width,initial-scale=1.0'title模拟计算器/titlest......
    <!DOCTYPEhtml>

    <htmllang="en">

    <head>

    <metacharset="UTF-8">

    <metahttp-equiv="X-UA-Compatible"content="IE=edge">

    <metaname="viewport"content="width=device-width,initial-scale=1.0">

    <title>模拟计算器</title>

    <style>

    button{

    width:39px;

    height:30px;

    background-color:rgb(102,240,102);

    }

    button:hover{

    background-color:black;

    color:rgb(255,249,237);

    }

    button:active{

    background-color:rgb(79,72,72);

    color:white;

    }

    table{

    background:rgb(192,248,109);

    }

    </style>

    </head>

    <body>

    <div>

    <tableborder="1px">

    <trstyle="text-align:center;">

    <tdcolspan="4">

    <inputtype="text"id="result">

    </td>

    </tr>

    <tr>

    <td><buttonid="le"onclick="getChar('(')">(</button></td>

    <td><buttonid="rg"onclick="getChar(')')">)</button></td>

    <td><buttonid="baifen"onclick="getChar('%')">%</button></td>

    <td><buttonid="C"onclick="clear1()">C</button></td>

    </tr>

    <tr>

    <td><buttonid="seven"onclick="getChar('7')">7</button></td>

    <td><buttonid="eight"onclick="getChar('8')">8</button></td>

    <td><buttonid="nine"onclick="getChar('9')">9</button></td>

    <td><buttonid="divi"onclick="getChar('/')">/</button></td>

    </tr>

    <tr>

    <td><buttonid="four"onclick="getChar('4')">4</button></td>

    <td><buttonid="five"onclick="getChar('5')">5</button></td>

    <td><buttonid="six"onclick="getChar('6')">6</button></td>

    <td><buttonid="mul"onclick="getChar('*')">*</button></td>

    </tr>

    <tr>

    <td><buttonid="one"onclick="getChar('1')">1</button></td>

    <td><buttonid="two"onclick="getChar('2')">2</button></td>

    <td><buttonid="three"onclick="getChar('3')">3</button></td>

    <td><buttonid="dec"onclick="getChar('-')">-</button></td>

    </tr>

    <tr>

    <td><buttonid="zero"onclick="getChar('0')">0</button></td>

    <td><buttonid="point"onclick="getChar('.')">.</button></td>

    <td><buttonid="="onclick="getResult()">=</button></td>

    <td><buttonid="add"onclick="getChar('+')">+</button></td>

    </tr>

    </table>

    </div>

    </body>

    <script>

    //点击按键返回按键值

    functiongetChar(btnid){

    varbtns=document.getElementsByTagName("button")

    switch(btnid){

    case'+':

    setNum('+')

    break;

    case'.':

    setNum('.')

    break;

    case'=':

    setNum('=')

    break;

    case'0':

    setNum('0')

    break;

    case'1':

    setNum('1')

    break;

    case'2':

    setNum('2')

    break;

    case'3':

    setNum('3')

    break;

    case'-':

    setNum('-')

    break;

    case'4':

    setNum('4')

    break;

    case'5':

    setNum('5')

    break;

    case'6':

    setNum('6')

    break;

    case'7':

    setNum('7')

    break;

    case'8':

    setNum('8')

    break;

    case'9':

    setNum('9')

    break;

    case'/':

    setNum('/')

    break;

    case'*':

    setNum('*')

    break;

    case'(':

    setNum('(')

    break;

    case')':

    setNum(')')

    break;

    case'%':

    setNum('%')

    break;

    default:

    break;

    }

    }

    //清空显示屏

    functionclear1(){

    document.getElementById("result").value=""

    }

    //将数值显示到显示屏

    functionsetNum(charCode){

    varorigin=document.getElementById('result');

    origin.value+=charCode;

    origin.innerText=origin.value;

    }

    //计算结果

    functiongetResult(){

    varres=eval(document.getElementById("result").value);

    //追加'='

    setNum('=');

    //追加结果

    setNum(res)

    }

    </script>

    </html>

    上一篇:利用js实现简单开关灯代码 下一篇:js生成唯一id,js生成uuid
    发布日期:2021/11/24
    手机扫二维码直达本页
    发布时间:16:11:58
    点击:144
    录入:齐天大圣
    相关文章
    Baidu
    YiJiaCMS 6.0.9.10888 Build 21.11.30(MSSQL) 闽ICP备05000814号-1
    本空间由腾讯云(轻量应用服务器)提供,百度云加速提供加速防护
    ©2000-2021