美文网首页
JavaScript计算器

JavaScript计算器

作者: 杰伊_约翰 | 来源:发表于2018-11-03 07:40 被阅读20次

计算器

switch下面的alert内的乘以100再除以100是为了时得到的数据更精准。

<!DOCTYPE html>
<html lang="en"> <head>
<meta charset="UTF-8">
<title>计算器</title>
<script type="text/javascript">
window.onload = function(){
var oInput01 = document.getElementById('input01');
var oInput02 = document.getElementById('input02');
var oSelect = document.getElementById('select');
var oBtn = document.getElementById('btn');
oBtn.onclick = function(){
var val01 = oInput01.value;
var val02 = oInput02.value;
//不做此判断会弹出“NaN”
if(val01=="" || val02==""){
alert('输入框不能为空!');
return;
}
if(isNaN(val01) || isNaN(val02)){
alert('请输入数字!');
return;
}

        switch(oSelect.value){ 
            case '0': 
                alert((parseFloat(val01)*100 + parseFloat(val02)*100)/100);
                break; 
            case '1': 
                alert((parseFloat(val01)*100 - parseFloat(val02)*100)/100); 
                break; 
            case '2': 
                alert((parseFloat(val01)*100) * (parseFloat(val02)*100)/10000); 
                break; 
            case '3': 
                alert((parseFloat(val01)*100) / (parseFloat(val02)*100)); 
                break;
        } 
    } 
} 
</script> 
</head>
<body>
<h1>计算器</h1> <input type="text" name="" id="input01" />
<select id="select"> <option value="0">+</option>
<option value="1">-</option> <option value="2">*</option>
<option value="3">/</option>
</select>
<input type="text" name="" id="input02" />
<input type="button" name="" value="计算" id="btn" />
</body>
</html>

相关文章

  • JavaScript计算器

    任意一个输入为空时: 任意一个不是数字时: 数字加减乘除:

  • JavaScript计算器

    body代码如下: JavaScript代码如下: 实现效果如下:

  • JavaScript计算器

    计算器 switch下面的alert内的乘以100再除以100是为了时得到的数据更精准。

  • 2018-11-10

    简单计算器(JavaScript实现) 功能比较简单,还需完善。 效果: HTML部分:

  • JavaScript制作简单计算器

    JavaScript经典小项目——制作简单的计算器功能使用JS完成一个简单的计算器 功能。实现2个输入框中输入整...

  • javascript设计计算器

    计算器 效果:

  • javascript简易计算器

    十五分钟用 JavaScript 基础写一个简易计算器 + 思路详解阅读 1220收藏 772017-04-12 ...

  • ES6

    历史 ECMAScrit 是96年 网景公司吧javascript提交给 欧洲计算器制作联合会 版本 97年1.0...

  • ES6总结

    历史ECMAScript 是96年网景公司把JavaScript提交给欧洲计算器制作联合会 版本97年1.098年...

  • ES6总结

    历史 ECMAScript 是96年网景公司把JavaScript提交给欧洲计算器制作联合会 版本 97年1.09...

网友评论

      本文标题:JavaScript计算器

      本文链接:https://www.haomeiwen.com/subject/hdohxqtx.html