javascript - 为什么内部 html 不能与 Javascript 一起使用？

Question

我很紧张，因为我不明白为什么我的代码不显示 Javascript 中的计算结果。 它是另一种语言，但基本上我只想输入两个变量，如果它们在它们应该是的值之间，它应该显示文本。 这是我的代码，我认为它看起来不错，但不知何故无法工作。

  document.getElementById('calculate').addEventListener('click', function("inwoners") {

    var bev = document.getElementById("bevdicht").value;
    var opp = document.getElementById("oppervlakte").value;

    if (bev < 1 || bev > 700 || opp < 0 || isNaN(bev) || isNaN(opp) || {
        div.innerHTML = "Ongeldige waarde ingevoerd!";
        return;
      }

      bev = parseInt(bev); opp = parseInt(opp);

      var inwoners = bev * opp;

      inwoners = Math.round(inwoners);

      if (inwoners > 582000 && inwoners < 585000) {
        var text = "Groningen";
      }
      if (inwoners > 643000 && inwoners < 646000) {
        var text = "Friesland";
      }
      if (inwoners > 48800 && inwoners < 49500) {
        var text = "licht overgewicht";
      }
      if (inwoners > 1130000 && inwoners < 1140000) {
        var text = "matig overgewicht";
      }
      /* if (bmi > 30 && bmi < 40) {
          var text = "ernstig overgewicht";
      }
      if (bmi > 40) {
          var text = "ziekelijk overgewicht"; */
    }

    div.getElementById('calc') innerHTML = "Het aantal inwoners in deze provincie zijn <b>" + inwoners + "</b><p></p> en het is de provincie <b>" + text + "</b>";
  }, false);

<form>
  De bevolkingsdichtheid is
  <input id="bevdicht" size="7" maxlength="5" type="text" placeholder="vul in" />
  <p></p>
  De oppervlakte van de provincie is
  <input id="oppervlakte" size="7" maxlength="9" type="text" placeholder="vul in" />vierkantemeter
  <p></p>
  <input onclick="inwoners()" type="button" value="Bereken!" />
</form>

<p>&nbsp</p>

<div id="calc">Het aantal inwoners in deze provincie zijn ..
  <p></p>en het is de provincie ...
</div>

如果您能帮助我，我将非常感激，也许这是我犯的一个愚蠢的错误

Answer 1

您遇到一些格式问题:

• 您没有任何 ID 为“calculate”的内容
• 您不能传递字符串( function("inwoners") )作为事件处理程序函数的第一个参数，因为传递给它的第一个参数始终是一个事件对象
• 在第 7 行，您有一个尚未在任何地方定义的“div”变量
• 第 6 行的 if 语句在条件后面缺少右括号，并且有一个 ||后面没有任何内容
• 第 34 行有一个额外的括号
• 如前所述，您在第 35 行的 innerHTML 之前遗漏了一个点