替换过时的“ keypress” DOM事件

Ale*_*mov 7 html javascript events dom dom-events

根据MDN文章 keypress事件已弃用:

在此处输入图片说明

但是我在其他地方找不到关于是否应在新项目中使用此事件的任何信息。如果我们不应该,那么替代品是什么?

有人可以提供见解吗?

Bar*_*mar 10

由于该事件已被弃用,您应该避免在新代码中使用它,并计划从旧代码中删除它。在W3C规范说这约不赞成使用的功能:

标记为已弃用的功能包含在规范中作为对旧实现或规范的参考,但它们是可选的且不鼓励使用。在本规范中,只有具有现有或正在进行的替换的功能必须被弃用。由于与现有内容向后兼容的原因,尚未包含对该功能的支持的实现可能会实现已弃用的功能,但创建内容的内容作者不应使用已弃用的功能,除非没有其他方法可以解决用例. 引用此规范的其他规范不应使用已弃用的功能,而应指向该功能已被弃用的替代功能。本规范中标记为弃用的功能预计将从未来的规范中删除。

的规范keypress event说:

警告本规范中定义了按键事件类型以供参考和完整性,但本规范不赞成使用此事件类型。在编辑上下文时,作者可以改为订阅beforeinput事件。

您还可以使用keydown和/或keyup事件。请参阅keyup、keydown、keypress 和 input 事件之间的区别是什么?

但是,由于beforeinput还没有太多支持,如果这些其他事件都不适合您的用例,您现在必须继续使用keypress(这是“除非没有其他方法可以解决用例”中的例外)规格)。

  • 此答案不涉及特定用例,例如 Windows 中的 Alt 键序列,其中生成的键码(例如 Alt+137 的“ë”)获取“keypress”事件,而不是“keyup”或“keydown”事件。仅将单个键“1”、“3”和“7”报告为 keyup 和 keydown,但不报告“ë”。所以他们可以随心所欲地弃用它,但除非他们提供真正的替代方案,否则我们天真的前端开发人员别无选择,只能使用“keypress”。 (9认同)
  • 这是真的,但`keydown` 有点不同。在这个问题中,我试图找出何时停止使用“keypress”的确切替代品。如果规范作者打算为此目的使用`beforeinput`,我相信它应该更精确匹配。 (3认同)
  • 完全同意你的看法。非常令人失望的是,在现实世界中实际上没有提供直接替代品的情况下,`keypress` 过早被弃用,让开发人员自己做出艰难的选择。 (3认同)
  • @Alohci 谢谢。为了更清楚地说明这一点,我一般不反对这种弃用。但这种特定情况的真正令人讨厌的部分是它过早被弃用。只有在提供了在相当程度的努力下实际上可行的替代品之后,弃用才是好的。我相信没有开发团队使用 `keypress`(这是限制 `inputs` 的字符集的最流行的选项)的工作应用程序会尝试搞乱 `keydown`、`input` 和 `keyup` 事件仅仅因为 `beforeinput`尚不可用。 (3认同)
  • @AlexanderAbakumov - 但这是弃用的重点,警告用户避免使用该功能,在这种情况下,因为它存在互操作性问题。当然,现实是主流浏览器都不会停止实现按键,因为这样做会破坏大量现有网站。目前这意味着您应该开始考虑如何组合使用 keydown、beforeinput、input 和 keyup 事件。您可以尝试检测 beforeinput 支持并使用它(如果可用),否则回退到按键。 (2认同)

小智 10

const handleKeyDown = (e: any) => {
  if (e.code === "Enter") {
  triggerBusqueda(e.target.value);
  }
};

onKeyDown={handleKeyDown}
Run Code Online (Sandbox Code Playgroud)