addEventListener不执行函数 1-1000猜数字游戏点击无响应问题求助

问题原因 #

• 事件绑定写法错误：addEventListener第二个参数需要传入函数引用，你写的guess()带了括号，会在页面加载时直接执行一次guess函数，不会把函数绑定到点击事件上，所以点击按钮没有反应。
• JS文件未引入：现有HTML代码仅引入了jQuery库，你写的猜数字逻辑的JS文件没有被引入到页面中，代码不会被执行。
• 存在隐式类型转换风险：input输入的值是字符串类型，直接和数字类型的随机数比较，可能出现不符合预期的结果。
• 逻辑缺陷：随机数生成范围是0-1000，不符合你设定的1-1000的游戏规则；猜中后没有终止判断，还会继续执行后续的大小判断逻辑，次数耗尽后也没有禁用输入避免重复操作。

修复方案 #

1. 先在HTML的</body>标签前、jQuery引入代码的后面，新增自定义JS脚本引入（如果是把JS直接写在页面里，就把下面的修复后代码放到<script>标签内即可）
2. 替换原有JS代码为修复后的版本：

// 生成1-1000的随机数，修正原范围错误
const randomnum = Math.floor(Math.random() * 1001) + 1;
let tries = 10;
// 提前获取DOM元素，避免重复查询
const inputEl = document.getElementById("input");
const helpEl = document.getElementById("help");
const resultEl = document.getElementById("result");
const guessBtn = document.getElementById("guess");

function guess(){
  const inputVal = Number(inputEl.value);
  // 输入合法性校验
  if (isNaN(inputVal) || inputVal < 1 || inputVal > 1000) {
    helpEl.innerText = "请输入1-1000之间的有效数字";
    inputEl.select();
    return;
  }

  tries--;
  // 优化逻辑分支，避免冗余判断
  if (inputVal === randomnum) {
    resultEl.innerText = "Gut，你猜对了！";
    helpEl.innerText = "";
    // 游戏结束禁用操作
    guessBtn.disabled = true;
    inputEl.disabled = true;
  } else if (tries === 0) {
    resultEl.innerText = `Du hast keine versucher mehr，正确数字是${randomnum}`;
    helpEl.innerText = "";
    guessBtn.disabled = true;
    inputEl.disabled = true;
  } else if (inputVal < randomnum) {
    helpEl.innerText = "Zu Klein，剩余次数：" + tries;
    resultEl.innerText = "";
  } else {
    helpEl.innerText = "Zu Groß，剩余次数：" + tries;
    resultEl.innerText = "";
  }
  inputEl.select();
}
// 传入函数引用，不带括号
guessBtn.addEventListener("click", guess);
// 额外补充回车提交功能，提升操作体验
inputEl.addEventListener("keyup", e => {
  if(e.key === 'Enter') guess();
})

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