1

Is it okay to use <button> elements (rather than anchor links) as tabs?

Here's my use-case...

I'm marking up a set of tabs using button elements, and when I try to assign them ARIA roles, I get this validation error:

enter image description here

It appears that the ARIA role tab is not allowed on <button> elements. Is there a reason you shouldn't use <button> for tabs?

In case it's helpful, here's the relevant markup:

<menu type="list" label="Tabs" role="tablist">
    <button id="tab-1" role="tab" aria-controls="panel-1" aria-selected="true" tabindex="0">Tab 1</button>
    <button id="tab-2" role="tab" aria-controls="panel-2" aria-selected="false" tabindex="-1">Tab 2</button>
</menu>

<section id="panel-1" role="tabpanel" aria-labelledby="tab-1" aria-hidden="false">...</section>
<section id="panel-2" role="tabpanel" aria-labelledby="tab-2" aria-hidden="true">...</section>
4

1 回答 1

1

Button 和 Tab 位于角色层次结构的不同部分:

  • 按钮是命令界面的一部分

  • Tab是sectionhead界面的一部分

于 2013-10-18T22:14:08.290 回答