javascript - 如何使这个 javascript 应用程序可访问?

标签 javascript accessibility web-applications

我正在制作一个 FTP 客户端,它将在很大程度上依赖于 javascript。

浏览文件时,您可以使用箭头键进行导航。我在当前选择的文件名中添加了一个 .selected 类,但我怎样才能让屏幕阅读器清楚这一点?我如何让他们关注当前文件名?

最好的方法是让每个文件名都成为一个 anchor ,当选择文件名时, anchor 将获得焦点吗?另外,我在哪里可以找到有关 Web 应用程序可访问性的良好指南?我知道 W3C 有一个内容可访问性 list ,但其中的大部分内容不适用于 Web 应用程序。

最佳答案

最简单的方法可能是拥有一系列复选框,每个复选框都有一个唯一的 ID,并配以一个标签:

<input id="chk01" type="checkbox"/><label for="chk01">File1.txt</label>

使用这种技术,输入为您完成选择的工作,而标签负责将其与名称相关联:当焦点转到复选框时,屏幕阅读器将自动读出关联的标签文本。都是纯 HTML,没有什么特别的要求。当然,您可以在此基础上自由添加选择颜色 - 只要您使其与复选框状态保持同步即可。

用A标签做类似的事情是可能的;你可以使用 WAI-ARIA在项目上适当设置 role="listitem"和 aria-selected="true"/"false"的属性,在父容器上设置 role="list"。然后屏幕阅读器会将这些作为列表项而不是链接读出。然而,这项技术涉及更多,并且确实需要使用实际的屏幕阅读器(例如 JAWS 或免费提供的 NVDA)进行测试以确保其有效。

关于javascript - 如何使这个 javascript 应用程序可访问?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/6110754/

相关文章:

ios - MKAnnotationView 自定义标注对辅助功能(VoiceOver)不可见

javascript - 使用键盘时需要删除 jQuery 菜单

jquery - 当 aria-expanded 为 true 时,如何让屏幕阅读器正确说出 'button expanded'

javascript - 你能将 javascript 应用程序封装在 java 容器中吗?

java - 从 index.html 重定向时,重定向应该是另一个 HTML 还是 JSP 页面?

javascript - 防止从网站保存图像(保存整个页面)

javascript - 如何缩小包含 css 代码的 javascript 文件

php - javascript, colorbox - 动态获取ID

javascript - 如何使用值对嵌套数组对象进行分组

javascript - 奇怪的 IE 和 Javascript 问题