2010-11-16 34 views
6

我们的网站涉及一些生成覆盖模式窗口的JavaScript。如何在JavaScript模式窗口上设置焦点?

尽管如此,一旦模态被触发,focus仍然在触发元素上,而不是在模态本身。

这些模式可以包括各种html元素,标题,段落和表单控件。我想要的是从模态内的第一个元素开始,所以最有可能是一个h4标记。

我已经探索了使用focus()函数,但是这不适用于一些html元素。

一个想法是在可以获得焦点的窗口中添加一个空的a标签,但我不确定这种方法。

回答

0

您可以将文本框添加到模态HTML的开头,设置焦点,然后隐藏文本框。只要我了解你的需求,应该有理想的效果。

+1

多数民众赞成在一种方式,但我不希望在代码中添加空的文本框,无论是易于访问和清洁的代码 – user502014 2010-11-16 16:13:59

+0

@ user502014该文本框将不可见,因此可访问性不应该是一个问题。如果你觉得有更清晰的代码可以随意使用它,只要记住你有“计划B”准备就绪。 – 2010-11-16 20:16:39

4

晚会很晚,但现有的答案不尊重无障碍。

W3C wiki page on accessible modals提供了比什么要求在OP中,相关部分具有模式容纳(也应该有一个aria-dialog属性)上tabindex=-1,使它能够:focus更深入的了解。

这是设置模态焦点的最方便的方式,还有更多关于仅将模态保留在模态中的文档 - 并将其返回到触发模态的元素 - 这里有相当多的解释,所以我建议任何有兴趣的人检查上面的链接。