Question

有谁知道各种屏幕阅读器如何与模态窗口交互，即：Thickbox？模态的内容在点击后会获得读者的注意力吗？

Answer 1

这取决于您使用的模态解决方案。许多人没有做好的重点管理工作：

将键盘焦点放在模态中的第一个元素上。
在达到模态结束时将焦点循环回第一个元素（而不是让焦点循环到浏览器镶边或模态后面的页面）。
当模态关闭时，将键盘焦点返回到原始位置（例如，打开按钮或链接）。

如果您使用的解决方案没有做到这一点，您可以在自己的JavaScript中执行此类操作。例如，如果您知道第一个可聚焦元素：

var focusMe = document.getElementById("#modal-focus-start");
if (focusMe) {
    focusMe.focus();
}

或者，如果您想将第一个链接聚焦在模态中。

var modal = document.getElementById("#modal"),
    focusMe;
if (modal) {
    focusMe = modal.getElementsByTagName("a")[0];
    if (focusMe) {
        focusMe.focus();
    }
}

如果你没有一个方便的可聚焦元素来移动焦点，一些现代浏览器（我上次检查时Firefox看起来很麻烦）允许你在任何HTML元素上设置tabindex到-1，使该元素可以通过JavaScript集中。

如果你想更进一步，可以在模态中use JavaScript to find the first focusable element (uses jQuery)。

屏幕阅读器如何处理模态窗口？

1 个答案: