标签 html 屏幕正在读取的字符串 reader

Question

我有一些动态生成的 html 使用 Dojo 库构建下拉菜单。我需要使我的代码符合可访问性，现在屏幕reader 查看菜单项并将其读取为普通 html:

menu.addChild(new MenuItem({
        label: "<a onclick=window.location.href='sampleurl.com'
                   href="sampleurl.com">Sample Link</a> ...

请原谅 onclick，这是针对不同的问题，但我得到的基本上是：

向下跳转到第一个菜单项

屏幕reader："Less than a onclick equals window dot location dot href equals sampleurl"...等等

我试过使用 aria-hidden，但屏幕 reader 只是将其读作文本，我在 Mac OS 上使用画外音，但我需要它也符合 JAWS。有什么提示或建议吗？谢谢！

Answer 1

使用工作示例以及说明您正在使用的屏幕 reader/浏览器组合的内容，调试起来会更容易。至少，向我们展示脚本的 HTML 输出，考虑到它正在为屏幕 reader 编写 HTML 进行解析。

话虽如此，我怀疑引号缺失/不一致。请注意，您以双引号开头的字符串，然后进入 onclick 属性，周围没有引号，然后在其值周围使用单引号，然后在 href.

周围使用双引号

或者，您将整个字符串写入页面并以某种方式HTML对其进行编码。

我建议使用 linting 工具来检查你的 JS。

Answer 2

label用于标签（可以在HTML），而不是用来放完整的link html标签。

见下页如何使用Dojo库生成菜单项： https://dojotoolkit.org/reference-guide/1.10/dijit/Menu.html

示例：

menu.addChild(new MenuItem({
    label: "Sample Link",
    onclick: function() {window.location.href='sampleurl.com';}}));