javascript insertBefore 在 addEventListener 上仅一次

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">