计算器

作者: 物极必反否极泰来 | 来源:发表于2018-11-11 18:17 被阅读0次

    <!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;
    
            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>

    相关文章

      网友评论

          本文标题:计算器

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