javascript - 单击按钮时 HTML 函数不返回值

Question

我编写了提供的代码。但点击按钮后，什么也没有出现。

function calculate() {
  var colony = document.getElementById("co").value;
  var dilution = document.getElementById("dil").value;
  var inoculum = document.getElementById("in").value;
  var b = parseFloat(dilution) * parseFloat(inoculum);
  var c = parseFloat(colony) / b;
  if (!isNaN(c)) {
    document.getElementById("multiplication").innerHTML = "the conentration is " + c;
  }
}

<button type="button" onclick="calculate">Calculate</button>
<p id="multiplication"></p>

Answer 1

1. 您没有调用calculate()函数。它应该是 onclick="calculate()" 而不是 onclick="calculate"。
2. 元素中没有 value 属性。使用元素的 innerText 属性。

function calculate() {
  var colony = document.getElementById("co").innerText;
  var dilution = document.getElementById("dil").innerText;
  var inoculum = document.getElementById("in").innerText;
  var b = parseFloat(dilution) * parseFloat(inoculum);
  var c = parseFloat(colony) / b;
  if (!isNaN(c)) {
    document.getElementById("multiplication").innerHTML = "the conentration is " + c;
  }
}

<button type="button" onclick="calculate()">Calculate</button>
<p id="multiplication"></p>
<div id="co">1</div>
<div id="dil">2</div>
<div id="in">4</div>