提问人：god_is_love 提问时间：10/1/2023 最后编辑：god_is_love 更新时间：10/2/2023 访问量：36
FullCalendar v6.1 使用 SiteImprove 浏览器扩展在 GridCalendar 视图上生成 50 个“ARIA 属性不受支持或禁止”错误
FullCalendar v6.1 is producing 50 `ARIA attribute unsupported or prohibited` errors on GridCalendar view using SiteImprove browser extension
问：
错误
我正在开发一个法律要求保持一定程度的可访问性的网站。我们使用 SiteImprove（一个免费的浏览器扩展程序）来检查问题。我在视图上收到 50 个错误。GridCalendar
不支持或禁止的 ARIA 属性 - 已在此类型的元素上指定了不支持或禁止的 ARIA 属性。
HTML 的
其中 49 个错误被报告为，它们看起来都与此类似......aria-label on a
<a aria-label="October 1, 2023" id="fc-dom-2" class="fc-daygrid-day-number">1</a>
这些错误中有 1 个报告为 HTML 如下所示......aria-labelledby on div
<div aria-labelledby="fc-dom-1" class="fc-view-harness fc-view-harness-active" style="height: 687.407px;">
<div class="fc-dayGridMonth-view fc-view fc-daygrid">
<table role="grid" class="fc-scrollgrid fc-scrollgrid-liquid">
...
</table>
</div>
</div>
描述
对于问题的咏叹调标签 - 我注意到标签没有属性，这并不是很好的做法。因此，当我手动添加它并指出它时，错误消失了。但是当我尝试将标签更改为 a 时，错误仍然存在。我检查了 FullCalendar GitHub 问题，并在 https://github.com/fullcalendar/fullcalendar/pull/6266 发现了可能与此相关的拉取请求。<a>href<span>
对于 div 问题上的咏叹调标签 - 坦率地说，我实际上也不确定该怎么做。我尝试删除该属性，当然错误消失了，但这可能不是正确的解决方案。我该怎么做？aria-labelledby
总结
- 简而言之，我不太确定如何解决这些 ADA 问题，因此我可以提出任何适当的建议，或者自己在本地解决这些问题。
- 如果这些真的是错误，我会提交一份错误报告，但他们提到“需要减少测试用例”，提交似乎有点令人生畏。
答：
0赞
slugolicious
10/2/2023
#1
锚标记上的 <a> 是完全有效的。但是，没有 锚标记将无法通过键盘进行聚焦。它被视为“占位符链接”。我认为siteimprove可能会对它试图报告的错误感到困惑。占位符链接本身并不是一个错误，但它可能是一个错误，siteimprove 应该给你一个警告或“你应该检查这个”消息。听起来你已经证明了这一点，通过添加一个，siteimprovement消息消失了。aria-labelhrefhref
aria-labelledby并且对 <div> 有效，如果该 <div> 也具有作用。如果没有角色，ARIA 属性很可能会被忽略。请参阅“2.10 实际支持”的倒数第三个要点：aria-label、aria-labelledby 和 aria-describedbyaria-label"
不要在 span 或 div 上使用 aria-label 或 aria-labelledby，除非它被赋予了角色。
如果您使用没有角色的 on，则从技术上讲这不是错误，但标签很可能不会被读取。我认为siteimprovement可能试图警告您这一点。aria-labelledby<div>
评论