为什么JS无法在计算器应用程序中读取value属性? [关闭]

问题描述 投票:2回答:1

我正在做一个计算器。检查器告诉我它无法读取我的JS第4行的value属性。

我已经逐行检查,但无法弄清楚自己在做什么错。我在YouTube上的mmtutus中关注this tutorial

我遍历了每一行,我的代码与他的相同。

function calc() {
  var a = parseInt(document.querySelector("#value1").value);
  var b = parseInt(document.querySelector("#value2").value);
  var op = document.querySelector("#operator").value;
  var calculate;

  if (op == "add") {
    calculate = a + b;
  } else if (op == "min") {
    calculate = a - b;
  } else if (op == "div") {
    calculate = a / b;
  } else if (op == "mul") {
    calculate = a * b;
  }

  document.querySelector("#result").innerHTML = calculate;
}
<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  <title>Document</title>
</head>

<body>
  <form>
    Value 1: <input type="text" id="value1" /> Value 2:
    <input type="text" id="value2" /> Operator:
    <select>
      <option value="add"> Add </option>
      <option value="min"> Subtract </option>
      <option value="div"> Divide </option>
      <option value="mul"> Multiply </option>
    </select>
    <button type="button" onclick="calc()">Calculate</button>
  </form>

  <div id="result"></div>
</body>

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

</html>

您能帮我找到问题的根源吗?

javascript html calculator
1个回答
1
投票

您尚未为'operator'分配类别或ID名称,因此找不到该元素。

© www.soinside.com 2019 - 2024. All rights reserved.