在 HTML5 对话框中处理回车键

时间:2021-07-16 23:12:07

标签: javascript html dom dialog modal-dialog

我已经实现了一个 HTML5 对话框,只要用户与按钮交互(发出“关闭”事件),它就可以正常工作。

但是假设您按下了 Enter 键。对话框也会关闭。我发现对话框还直接拦截键盘事件,并自动关闭对话框。这绕过了我的处理代码。

我无法弄清楚如何拦截键盘事件,也不清楚拦截和处理的事件是在DOM的哪个级别。在对话框上放置“keyup”或类似的侦听器似乎无法获取事件。

当对话框处于“开启”状态时,默认情况下键盘事件在哪里截获,我如何获取它们?

1 个答案:

答案 0 :(得分:0)

好的,我理解这种行为。

为了测试我的对话框,我有一个带有“Dialog”文本的按钮。此按钮上的单击处理程序切换是否显示对话框。

所以,我按下“对话框”按钮,然后显示对话框。

但是:即使该按钮被模态对话框隐藏,但事实证明该按钮仍然具有焦点。所以回车键由(当前隐藏的)对话框按钮处理,而不是对话框,也不是对话框中的两个按钮中的任何一个。由于对话框按钮的单击处理程序会切换对话框的显示状态,因此那个 处理程序会关闭对话框。

修复是使对话框中的正确按钮具有焦点,因此按下 Enter 键将导致正确的操作。

相关问题