我想创建一个窗口覆盖我的实际内容。当可见时,这个窗口(及其子窗口)应该是通过鼠标和Tab键获得焦点的唯一元素。任何背景元素都不应该再获得焦点。我确信我可以使用pointer-events: none;来阻止背景中的元素接收焦点或被点击。我知道通过Tab键获得的任何焦点都可以通过在特定元素上设置tabindex="-1"来阻止。所以我想知道是否有更优雅的解决方案,而不是对每个元素单独应用负的tabindex。
pointer-events: none;
tabindex="-1"
tabindex
vaqhlq811#
你可以在你的窗口后面使用一个覆盖层来阻止鼠标交互,使用一个焦点陷阱web组件(比如https://www.webcomponents.org/element/@a11y/focus-trap)来防止键盘操作聚焦到外面。
1条答案
按热度按时间vaqhlq811#
你可以在你的窗口后面使用一个覆盖层来阻止鼠标交互,使用一个焦点陷阱web组件(比如https://www.webcomponents.org/element/@a11y/focus-trap)来防止键盘操作聚焦到外面。