手记

Kevin例子(1):简单使用判断语句实现 简易计算器

<!doctype html>
<html>
    <head>
        <meta charset="utf-8">
    </head>
    <body>

        <input type="text" id="num1" value="0">
        <select id="op">
            <option value="+" selected>+</option>
            <option value="-" >-</option>
            <option value="*" >×</option>
            <option value="/" >÷</option>
        </select>
        <input type="text" id="num2" value="0">
        <button type="button" id="calculate">=</button>
        <input type="text" id="result" value="0">
        <script>
            var num1 = document.getElementById('num1');
            var num2 = document.getElementById('num2');
            var opBtn = document.getElementById('op');
            var result = document.getElementById('result');
            var calculateBtn = document.getElementById('calculate');

                calculateBtn.onclick = function(){
                var op = opBtn.value;
                var num1Val = parseInt(num1.value);
                var num2Val = parseInt(num2.value);
                switch(op){
                    case '+':{
                        result.value = num1Val + num2Val;
                        break;
                    }
                    case '-':{
                        result.value = num1Val - num2Val;
                        break;
                    }
                    case '*':{
                        result.value = num1Val * num2Val;
                        break;
                    }
                    case '/':{
                        if(num2Val == 0){
                            alert('被除数不能为0');
                            break;
                        }
                        result.value = num1Val / num2Val;
                        break;
                    }
                }
            }
        </script>
    </body>
</html>
1人推荐
随时随地看视频
慕课网APP