gaoquanquan

用JS做了一个简易的网页计算器

<!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 oFuhao = document.getElementById(\'fuhao\');
            var oBtn = document.getElementById(\'btn\');

            oBtn.onclick = function(){
                var num01 = oInput01.value;
                var num02 = oInput02.value;
                var fuhao = oFuhao.value;

                //验证是否为空
                if(num01==\'\'||num02==\'\'){
                    alert(\'输入框不能为空!\');
                    return;
                }
                if(isNaN(num01)||isNaN(num02)){
                    alert(\'请输入数字!\');
                    return;
                }

                switch (fuhao){
                    //这个value是字符串!
                    case "0":
                        alert((parseFloat(num01)*100+parseFloat(num02)*100)/100);
                        break;
                    case \'1\':
                        alert((parseFloat(num01)*100-parseFloat(num02)*100)/100);
                        break;
                    case "2":
                        alert(((parseFloat(num01)*100)*(parseFloat(num02)*100))/10000);
                        break;
                    case \'3\':
                        alert(((parseFloat(num01)*100)/(parseFloat(num02)*100)));
                }
            }
        }
    </script>
</head>
<body>
    <h1>计算器</h1>
    <input type="text" name="" id="input01">
    <select id="fuhao">
        <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>

 

分类:

技术点:

相关文章:

  • 2021-12-10
  • 2021-11-27
  • 2022-12-23
  • 2021-09-01
  • 2021-12-12
  • 2021-12-02
  • 2021-11-27
  • 2021-11-27
猜你喜欢
  • 2021-11-27
  • 2021-10-15
  • 2021-12-12
  • 2021-04-19
  • 2021-11-27
  • 2021-11-27
相关资源
相似解决方案