“此时元素li上不允许扩展属性aria” [英] "Attribute aria-expanded not allowed on element li at this point"

问题描述

我有以下代码（从这里）：

<div role="menubar">
    <ul role="menu" aria-label="functions" id="appmenu">
            <li role="menuitem" aria-haspopup="true" tabindex="0" aria-expanded="false">
                File
                <ul role="menu">
                            <li role="menuitem" tabindex="-1">New</li>
                            <li role="menuitem" tabindex="-1">Open</li>
                            <li role="menuitem" tabindex="-1">Print</li>
                    </ul>
            </li>
            <li role="menuitem" aria-haspopup="true" tabindex="-1" aria-expanded="false">
                Edit
                <ul role="menu">
                            <li role="menuitem" tabindex="-1">Undo</li>
                            <li role="menuitem" tabindex="-1">Redo</li>
                            <li role="menuitem" tabindex="-1">Cut</li>
                            <li role="menuitem" tabindex="-1">Copy</li>
                            <li role="menuitem" tabindex="-1">Paste</li>
                    </ul>
            </li>
            <li role="menuitem" aria-haspopup="true" tabindex="-1" aria-expanded="false">
                    Format
                    <ul role="menu">
                            <li role="menuitem" tabindex="-1">Font</li>
                            <li role="menuitem" tabindex="-1">Text</li>
                    </ul>
            </li>
            <li role="menuitem" aria-haspopup="true" tabindex="-1" aria-expanded="false">
                View
                <ul role="menu">
                    <li role="menuitem" tabindex="-1">100%</li>
                    <li role="menuitem" tabindex="-1">Zoom In</li>
                    <li role="menuitem" tabindex="-1">Zoom Out</li>
                </ul>
            </li>
            <li role="menuitem" tabindex="-1" aria-expanded="false">Help</li>
    </ul>
</div>

但是当我尝试验证时（通过W3C验证器）它给出错误的HTML片段：

However when I try to validate (via the W3C validator) that HTML piece it gives the error:

属性 aria-expanded 此时元素 li 上不允许。

由于这是官方的W3C示例，我有点困惑，因为他们自己的示例没有使用自己的验证器进行验证。这里有什么问题？

As this is an official W3C example I’m a little bit confused as their own example didn’t validate with their own validator. What’s wrong here?

推荐答案

这里是W3C HTML检查器（验证器）的维护者。我认为检查器的行为符合预期，因为 aria-expanded ， role = menuitem 。

Maintainer of the W3C HTML checker (validator) here. I think the checker’s behaving as expected for this, because aria-expanded with role=menuitem isn’t allowed by the ARIA spec.

至于 https：// www。 w3.org/WAI/tutorials/menus/examples/appmenu/ 示例使用无效标记，根据我的经验，有许多例子无效。没有什么意思是官方/权威与ARIA规范和其他规范相同，所以当你注意到一个与ARIA规范要求不符的例子时，你应该在 https://github.com/w3c/wai-tutorials/issues 以便修复示例。

So as far as why that https://www.w3.org/WAI/tutorials/menus/examples/appmenu/ example’s using invalid markup, in my experience there are a number of examples there which are invalid. Nothing there’s meant to be official/authoritative in the same sense that the ARIA spec and other specs are though, so when you notice an example like which doesn’t match the ARIA spec requirements, you should report it at https://github.com/w3c/wai-tutorials/issues so that the example can be fixed.

根据我的经验，当人们花时间报告这些教程中的错误时，会很快得到修复。

In my experience, when people take time to report bugs in those tutorials, they get fixed quickly.

2017-07-09更新：另见 关于在StackOverflow上使用'aria-expanded'在'role = menuitem'上，请参阅 https://github.com/w3c/aria/issues/454 ARIA 1.1：menuitem角色不支持aria-expanded在ARIA Working Gr oup的ARIA规范问题跟踪器。

2017-07-09 Update: See also the answer at About use 'aria-expanded' on 'role=menuitem' here at StackOverflow and see https://github.com/w3c/aria/issues/454 "ARIA 1.1: aria-expanded is not supported on menuitem roles" in the ARIA Working Group’s issue tracker for the ARIA spec.

这篇关于“此时元素li上不允许扩展属性aria”的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！