Quiz06.html 2.07 KB
<!DOCTYPE html>
<html lang="ko">

<head>
    <meta charset="utf-8">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>

</head>

<body>
    <div>
        <input type="text" id="a">
        <select id='op'>
            <option>+</option>
            <option>-</option>
            <option>*</option>
            <option>/</option>
        </select>
        <input type="text" id="b"> =
        <span id="result"></span>
    </div>
    <button id="exec"> 계산 </button>

    <script>
        $(document).ready(function () {
            $("#exec").click(function () {
                    var _result;

                    if ($("#a").val() == "" || $("#b").val() == "") {
                        alert("입력 되지 않은 문자가 있습니다.");
                    }

                    var _a = parseFloat($("#a").val());
                    var _b = parseFloat($("#b").val());

                    switch ($("#op").val()) {
                        case "+":
                            _result = _a + _b;
                            break;
                        case "-":
                            _result = _a - _b;
                            break;
                        case "*":
                            _result = _a * _b;
                            break;
                        case "/":
                            _result = _a / _b;
                            break;

                    }

                    // 0으로 나눌시 Infinity를 출력하기에 이부분에 대한 에러수정은 교수님의 허락을 구해, 구현하지않았습니다.

                    // 잘못 된 값입력시 에러 발생
                    if (isNaN(_result)) {
                        _result = "Error";
                        alert("재입력 하세요.");
                    }


                    console.log(_a);
                    console.log(_b);
                    console.log(_result);

                    $("#result").text(_result); // 여기에 연산 결과를 넣어줌
                })
        });
    </script>

</body>

</html>