Question

我有一个 input type="number" 字段，我想在其中控制不插入负数。使用 addEventListener 执行此操作，但会在您输入该字段的每个数字上执行。

var number = document.querySelector("input[type=number]")

number.addEventListener('input', function() {
  var valeur = number.value
  if (valeur.startsWith("-")) {
    erreur = document.createElement("div")
    erreur.innerHTML = "No negative numbers."
    number.appendChild(erreur)
    number.parentNode.insertBefore(erreur, number.nextSibling);
  } else {
    erreur.remove()
  }
})

<input type="number" step="any" name="amount">

我应该更改什么才能让消息只显示一次？

Answer 1

您应该将 div 的创建放在 if 条件之外

let erreur = document.createElement("div")
number.addEventListener('input', function() {

var number = document.querySelector("input[type=number]")
let erreur = document.createElement("div")

number.addEventListener('input', function() {
  var valeur = number.value
  if (valeur.startsWith("-")) {
    erreur.innerHTML = "No negative numbers."
    number.appendChild(erreur)
    number.parentNode.insertBefore(erreur, number.nextSibling);
  } else {
    erreur.remove()
  }
})

<input type="number" step="any" name="amount">

javascript insertBefore 在 addEventListener 上只执行一次

1 个答案: