找不到 Javascript 页面的定义

Question

我接到了一项任务，要使用 HTML 和 JavaScript 创建一个简单的计算器。我构建了一个简单的 HTML 页面，其中包含两个数字和一个运算符的三个输入。
我还创建了一个 JS 页面，其中包含一个可以操作计算器的函数。

当我使用 HTML 页面中的 <script> 标签连接两个页面时，当我检查 JS 页面时，会弹出一条短消息："No definition found for CalculatorJS.js" (我的 JS 页面）。

这是我的 HTML 页面代码：

<head>  
    <title>Calculator</title>
</head>
<body>
    <h1>Simple Calculator</h1>
    <h3>Enter two numbers and an operation in the right places below</h3>
    <br>
    <br>
    <span><span> First Number</span> <span>Operation</span> <spaqn>Second        Number</span> </span>
    <br>
    <input type="text" id="firstNum">
    <span></span>

    <input type="text" id="operation">
    <span></span>

    <input type="text" id="secondNum">
    <span></span>

    <script src="CalculatorJS.js"></script>

    <button onclick="Calculate()">Calculate</button>

</body>

这是我的 JS 页面代码：

var num1 = document.getElementById("firstNum").value;
var num2 = document.getElementById("secondNum").value;
var operator = document.getElementById("operation").value;


var resulte = 0;
function Calculate(num1, operator,num2)
{
    if(operator == "+")
    {
        resulte = num1 + num2;
    }
    else if(operator == '-')
    {
        resulte = num1 - num2;
    }
    else if(operator == '*')
    {
        resulte = num1 * num2;
    }
    else if(operator == '/')
    {
        reulte = num1 / num2;
    }
    else{
        resulte = 'InValid Operator';
    }
    alert(resulte);
}

function Calculate2(num1, operator,num2)
{
    switch (operator) {
        case value: '+'
            return num1 + num2;
            break;
        case value: '-'
            return num1 - num2;
            break;
        case value: '*'
            return num1 * num2;
            break;
        case value: '/'
            return num1 / num2;
            break;

        default:
        return alert("InValid Charachter")
            break;
    }
}

是否我在任一页面中做了什么导致计算器无法工作？
当我尝试做一个像 1+1 这样的简单计算时，我在写 "InValid Operator".

的地方收到警报

Answer 1

抱歉，您必须在调用函数之前将 num1 和 num2 解析为 int

var num1 = parseInt(document.getElementById("firstNum").value);
var num2 = parseInt(document.getElementById("SecondNum").value);

Answer 2

加载页面时，变量 num1、num2 和 operation 取空值。之后，当您输入值并触发 Calculate 函数时，这三个变量将一无所获，因为它们在 Calculate 方法之外，因此显示 "Invalid operator".

您必须在 Calculate 函数中声明 num1、num2 和 operation。然后这三个变量将获得它们的值并显示结果。检查以下内容：

var resulte = 0;
  function Calculate()
  {
   var num1 = parseInt(document.getElementById("firstNum").value);
   var num2 = parseInt(document.getElementById("secondNum").value);
   var operator = document.getElementById("operation").value;
   if(operator == "+")
   {
    resulte = num1 + num2;
   }
   else if(operator == '-')
   {
    resulte = num1 - num2;
   }
   else if(operator == '*')
   {
    resulte = num1 * num2;
   }
   else if(operator == '/')
   {
    resulte = num1 / num2;
   }
   else{
    resulte = 'InValid Operator';
   }
   alert(resulte);
  }

  function Calculate2(num1, operator,num2)
  {
   switch (operator) {
    case value: '+'
     return num1 + num2;
     break;
    case value: '-'
     return num1 - num2;
     break;
    case value: '*'
     return num1 * num2;
     break;
    case value: '/'
     return num1 / num2;
     break;

    default:
    return alert("InValid Charachter")
     break;
   }
  }

<head>  
    <title>Calculator</title>
</head>
<body>
    <h1>Simple Calculator</h1>
    <h3>Enter two numbers and an operation in the right places below</h3>
    <br>
    <br>
    <span><span> First Number</span> <span>Operation</span> <span>Second        Number</span> </span>
    <br>
    <input type="text" id="firstNum">
    <span></span>

    <input type="text" id="operation">
    <span></span>

    <input type="text" id="secondNum">
    <span></span>

    <button onclick="Calculate()">Calculate</button>

</body>

Answer 3

<head>
    <title>Calculator</title>
</head>

<body>
    <h1>Simple Calculator</h1>
    <h3>Enter two numbers and an operation in the right places below</h3>
    <br>
    <br>
    <span><span> First Number</span> <span>Operation</span>
    <spaqn>Second Number</span>
        </span>
        <br>
        <input type="text" id="firstNum">
        <span></span>

        <input type="text" id="operation">
        <span></span>
        <input type="text" id="secondNum">
        <span></span>

        <button onclick="Calculate()">Calculate</button>

</body>
<script>
    var resulte = 0;

    function Calculate() {
        var num1 = parseInt(document.getElementById("firstNum").value);
        var num2 = parseInt(document.getElementById("secondNum").value);
        var operator = document.getElementById("operation").value;
        if (operator == "+") {
            resulte = num1 + num2;
        } else if (operator == '-') {
            resulte = num1 - num2;
        } else if (operator == '*') {
            resulte = num1 * num2;
        } else if (operator == '/') {
            resulte = num1 / num2;
        } else {
            resulte = 'InValid Operator';
        }

        alert(resulte);

    }
</script>

Answer 4

<head>
    <title>Calculator</title>
</head>

<body>
    <h1>Simple Calculator</h1>
    <h3>Enter two numbers and an operation in the right places below</h3>
    <br>
    <br>
    <span><span> First Number</span> <span>Operation</span>
    <spaqn>Second Number</span>
        </span>
        <br>
        <input type="text" id="firstNum">
        <span></span>

        <input type="text" id="operation">
        <span></span>

        <input type="text" id="secondNum">
        <span></span>

        <button onclick="Calculate()">Calculate</button>

        <script>
            var resulte = 0;

            function Calculate() {
                var num1 = document.getElementById("firstNum").value;
                var num2 = document.getElementById("secondNum").value;
                var operator = document.getElementById("operation").value;

                if (operator == "+") {
                    resulte = Number(num1) + Number(num2);
                } else if (operator == '-') {
                    resulte = Number(num1) - Number(num2);
                } else if (operator == '*') {
                    resulte = Number(num1) * Number(num2);
                } else if (operator == '/') {
                    if (Number(num2) == 0) {
                        resulte = 'Invalid Operation';
                        alert('Division by zero is undefined.')
                    } else {
                        resulte = Number(num1) / Number(num2);
                    }
                } else {
                    resulte = 'InValid Operator';
                }
                alert(resulte);
            }
        </script>
</body>

找不到 Javascript 页面的定义

No definition found for Javascript page

html

javascript

function

calculator