Question

我有一个div块，其值在更改输入值时要调整。当输入值增加时，它工作正常，但回落时，它不变。也许我在逻辑上忽略了一些愚蠢的事情。

var quanityAmount = document.getElementById("quantity");
var letterDisplay = document.getElementById("display");
quanityAmount.addEventListener("change", function() {
  var quanityValue = quanityAmount.value;
  if (quanityValue === 1) {
    letterDisplay.innerHTML = "a";
  } else if (quanityValue >= 2) {
    letterDisplay.innerHTML = "b";
  }
});

<input type="number" id="quantity" name="quantity" value="1" min="1" >

<div id="display">a</div>

我有一个console.log(quanityvalue)，并且该值确实发生了变化并检测到诸如1、2并返回到1。

Answer 1

输入的值是一个字符串，所以"1" !== 1。需要将其转换为数字。

var quanityAmount = document.getElementById("quantity");
var letterDisplay = document.getElementById("display");
quanityAmount.addEventListener("change", function() {
  var quanityValue = +quanityAmount.value;
  if (quanityValue === 1) {
    letterDisplay.innerHTML = "a";
  } else if (quanityValue >= 2) {
    letterDisplay.innerHTML = "b";
  }
});

<input type="number" id="quantity" name="quantity" value="1" min="1" >

<div id="display">a</div>

addEventListener（“ change” ...用于输入，可更改innerHTML的值，但不会降低

1 个答案: