输入框验证提示后无法清除问题求助：前端输入值重置失效排查

核心问题 #

你当前的代码里，let integer = document.getElementById("integer").value只是把输入框的值拷贝到了变量integer中，后续给integer赋值空字符串，只是修改了变量的内容，并没有同步到页面上的输入框DOM元素，所以输入框不会被清空。

修复方案 #

要直接操作输入框的DOM元素，通过它的value属性来读取值和清空输入框：

修正后的完整代码示例 #

// 先获取输入框的DOM元素引用
const inputBox = document.getElementById("integer");
// 把输入值转成数字（输入框默认返回字符串，必须转成数字才能正确做范围判断）
const inputNum = parseInt(inputBox.value, 10);

if (isNaN(inputNum) || inputNum < 1 || inputNum > 100) {
  alert("Please enter a valid input \nEnter any number between 1 and 100");
  // 直接修改DOM元素的value属性，清空输入框
  inputBox.value = "";
}

额外优化提示 #

• 加入isNaN判断：如果用户输入的不是纯数字，也能触发提示并清空，避免非数字值导致判断逻辑失效
• 使用parseInt时指定基数10，确保字符串转数字的准确性，避免出现八进制解析的意外情况

内容的提问来源于stack exchange，提问作者user17093903