如何为querySelector获取的输入框添加Enter按键监听器并解决event废弃问题？

问题分析 #

你的代码存在两个核心问题导致功能失效：

• 事件回调未显式声明event参数，依赖的全局event对象已被浏览器标记为废弃，因此会出现划线提示。
• 判断按键时使用的enter是未定义变量，正确写法应为字符串'Enter'。

修正后的代码 #

document.querySelectorAll('.quantity-input')
  .forEach((inputBar) => {
    inputBar.addEventListener('keydown', (event) => { // 显式接收event参数
      if (event.key === 'Enter') { // 使用字符串'Enter'匹配按键
        console.log('hello');
        // 替换为保存按钮的逻辑，比如触发按钮点击：
        // document.querySelector('.save-button').click();
        // 或直接调用保存对应的处理函数
      }
    })
  }) 

补充说明 #

若要实现和点击保存按钮完全一致的效果，只需将console.log('hello')替换为触发保存按钮的点击事件，或者直接调用保存逻辑对应的处理函数即可。

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