如何使我的点击可以通过键盘选项卡
问题描述:
我有这个链接,看起来更像是一个按钮 - 但每当我通过键盘测试我的标签导航时 - 此链接永远不会,用户也无法使用它。如何使我的点击可以通过键盘选项卡
我该如何使它符合ADA标准并使用aria通过键盘访问?
<div class="styles">
<a class="btn btn-primary" (click)="handlingClick($event)" id="addUser">Add User</a>
</div>
答
您必须添加tabindex属性。
<a class="btn btn-primary" (click)="handlingClick($event)" id="addUser" tabindex="0">Add User</a>
值0
给它基于DOM元素的顺序上的自然标签索引。
答
锚元素是本地可聚焦的。您的链接未获得关注的原因是因为它没有href
属性。
处理这个问题将是一个不存在的URL片段标识符添加到href属性,像这样的另一种方法:
<div class="styles">
<a class="btn btn-primary" href="#void" (click)="handlingClick($event)" id="addUser">Add User</a>
</div>
没有HREF就无法集中;改用''按钮。 –
@GregMcMullen - 工作! – bluePearl
@GregMcMullen这就是为什么我们有“tabindex”属性。值“0”根据它在DOM中的位置给它一个逻辑标签顺序。无需切换到按钮。 – Tom