javascript - 一个 HTML 页面上的多个表单 : how to restrict tabbing to a single form?

标签 javascript html accessibility

我目前正在 build 的网站与常规网站略有不同。所有站点内容都位于一个 index.php 文件中,而不是拥有多个单独的页面,并且用户使用绝对定位和 javascript 在站点之间“平移”页面。

页面中也有几种不同的形式。有人告诉我不要担心迎合那些禁用 Javascript 的人,所以我们为页面上的所有表单选择了 jQuery 和 JSON 网络服务。现在一切正常,但存在一个轻微的可用性问题:制表符索引。

由于存在多个表单,从一个输入字段跳转到下一个输入字段可能会导致用户在到达表单末尾然后再次跳转时突然跳转到站点的完全不同的部分。这在 Firefox 和 Safari 中尤其烦人,因为在这些情况下,在使用 Tab 键时按钮和单选按钮会被忽略。

所以这是我的问题:有没有人知道一种方法可以将用户的注意力限制在单个表单元素上?

最佳答案

The site I'm currently building is a little different from the norm. Instead of having multiple separate pages, all site content is on a single index.php file, and using absolute positioning and javascript the user "pans" across the site from page to page.

这里有一种替代方法可以回避这个问题,并且最终可能更易于访问。

我假设您在该页面上有一些元素可用于触发从一个子页面平移到另一个子页面?

如果是这样,这里的基本思想是,当任何页面“滚动关闭”时,使用 display:none 或 visibility:hidden 隐藏该“子页面”(大概是某个容器 DIV)。

这里的关键问题是,使用这两种方法中的任何一种隐藏的内容都是不可切换的,因此用户不会意外切换到那些隐藏的页面。同样重要的是,从可访问性的 Angular 来看,屏幕阅读器知道忽略以这种方式标记的内容,因此他们只会阅读当前页面(这与视力正常的用户所看到的一致),而不是整个页面。

关于javascript - 一个 HTML 页面上的多个表单 : how to restrict tabbing to a single form?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/5484496/

相关文章:

javascript - PhoneGap 和 Highcharts

html - 下拉列表中的表格

Java Play : bindFromRequest() not working

html - 如何在表格单元格中实现不可见但可访问的链接?

javascript - cfml jquery 未捕获语法错误无效 token ?

javascript - 在react-native中动态创建json

javascript - 给活跃的 li 元素一个不同的背景

javascript - 带有部分星星的 jQuery 星级评分系统

javascript - 辅助功能:让 VoiceOver 阅读文本而不关注网页

html - 打开时如何限制仅在模态弹出窗口中按下 Tab 键?