Js delta 的值总是等于 0

Question

大家好，我是 js 的新手，我正在尝试制作一个简单的程序来计算 delta，但问题是我始终将 delta 的值设置为 0，但是当我将静态值设置为 delta 时，就像 int 一样显示正确的值哪里有问题，谢谢

var first = document.getElementById("Cofession1"),
second = document.getElementById("Cofession2"),
third = document.getElementById("Cofession3"),
displayMessage = document.getElementById("solution"),
a = first.value,
b = second.value,
c = third.value,
btnClick = document.getElementById("calculateButton");
btnClick.onclick = function () {
var delta = b*5;
displayMessage.innerHTML = "delta = " + delta;
}

这是 html

<input type="text" name="" id="Cofession1" placeholder="The value of a">
<input type="text" name="" id="Cofession2" placeholder="The value of b">
<input type="text" name="" id="Cofession3" placeholder="The value of c">
<button id="calculateButton">Calculate</button>
<div id="solution"></div>

Answer 1

a、b 和 c 的值不会自动更新：您需要在 onclick 方法中分配它们，以便它们反映当时的值按钮被点击。否则它们将始终为空字符串，因为它们仅在运行时计算。

此外，我不建议直接分配给 onclick，而是使用更现代的 addEventListener。

var first = document.getElementById("Cofession1");
var second = document.getElementById("Cofession2");
var third = document.getElementById("Cofession3");
var displayMessage = document.getElementById("solution");

btnClick = document.getElementById("calculateButton");
btnClick.addEventListener('click', function() {
  // Assign values in the event handler
  var a = first.value;
  var b = second.value;
  var c = third.value;
  var delta = b * 5;
  displayMessage.innerHTML = "delta = " + delta;
});

<input type="text" name="" id="Cofession1" placeholder="The value of a">
<input type="text" name="" id="Cofession2" placeholder="The value of b">
<input type="text" name="" id="Cofession3" placeholder="The value of c">
<button id="calculateButton">Calculate</button>
<div id="solution"></div>

Js delta 的值总是等于 0

Js Value of delta equal 0 always

html

javascript

dom

var