Html JAWS屏幕阅读器在FireFox中重复树项目

我遇到了JAWS屏幕阅读器&Firefox的问题

我有一棵像下面那棵一样的树。无论何时

还有什么值得关注的

---

非常感谢。

您至少应该使用

aria owns

来显示父母和孩子之间的关系。看看这个例子

另外，实际上最好只使用已有的分层列表项结构。请参见此示例：

---

如果您已经这样做了，但仍然存在问题，请尝试使用NVDA而不是JAWS。NVDA比JAWS更符合标准。

在问了这个问题后，我再次找到了答案：(

显然，如果我将

role=“tree”

从外部

移动到第一个

，Firefox会像预期的那样叙述。现在的标记如下所示：

<nav>
  <ol role="tree">
    <li role="presentation">
      <a href="javascript:void(0)" role="treeitem">Parent Link 1</a>
      <ol role="group">
        <li role="presentation">
          <a href="javascript:void(0)" role="treeitem">Child Link 1</a>
        <li role="presentation">
          <a href="javascript:void(0)" role="treeitem">Child Link 2</a>
      </ol>
    <li role="presentation">
      <a href="javascript:void(0)" role="treeitem">Parent Link 2</a>
      <ol role="group">
        <li role="presentation">
          <a href="javascript:void(0)" role="treeitem">Child Link 3</a>
        <li role="presentation">
          <a href="javascript:void(0)" role="treeitem">Child Link 4</a>
      </ol>
  </ol>
</nav>

<button>Something else to focus on</button>

还有什么值得关注的

---

对我来说，这闻起来像是Firefox中的一个bug。&将随着事态的发展。

aria拥有的

是不必要的，因为

treeitem

是其

组

的后代（与示例42不同）。我不确定你所说的“使用你已经拥有的分层列表结构”是什么意思。上述代码的结构与示例41非常相似，该示例显然更完整。我可能不理解您的结构，但如果Paret Link 1是子链接1的父级，则它需要

aria拥有
，或者它需要是该元素（以及所有其他子级）的层次父级你是对的。我把自己弄糊涂了。不幸的是，这一改变并没有解决JAWS的根本问题。JAWS和我发给你的示例也有同样的问题吗？不，我没有。我的猜测是因为在示例中，
角色=树
在
上，而不是
上。我认为这不会有什么区别，所以我认为这是一个JAWS和/或Firefox错误。
<nav>
  <ol role="tree">
    <li role="presentation">
      <a href="javascript:void(0)" role="treeitem">Parent Link 1</a>
      <ol role="group">
        <li role="presentation">
          <a href="javascript:void(0)" role="treeitem">Child Link 1</a>
        <li role="presentation">
          <a href="javascript:void(0)" role="treeitem">Child Link 2</a>
      </ol>
    <li role="presentation">
      <a href="javascript:void(0)" role="treeitem">Parent Link 2</a>
      <ol role="group">
        <li role="presentation">
          <a href="javascript:void(0)" role="treeitem">Child Link 3</a>
        <li role="presentation">
          <a href="javascript:void(0)" role="treeitem">Child Link 4</a>
      </ol>
  </ol>
</nav>

<button>Something else to focus on</button>