Html 选项卡焦点不与离子标签配合使用以实现辅助功能

我正在尝试在我的Ionic web应用程序中实现可访问性，但键盘选项卡聚焦无法使用

离子标签

，无法通过屏幕阅读器读取标签。以下是标签的

HTML

：

忘记密码了？

---

当我使用键盘选项卡按钮时，焦点跳过此元素并转到下一个元素。

标签默认情况下不可聚焦

应该改用
或
元素（我不知道该怎么做）

如果所需操作要保持在同一页面上，请使用

如果要导航到其他页面，请使用

您唯一的其他选择（这是一个最后的方法，因为上面的标记似乎没有必要），就是在可单击元素上使用
tabindex=0

这将使元素在页面的制表符顺序内可聚焦（不要对
tabindex
使用正整数，因为这会破坏制表符顺序）。
如上文所述，Graham Ritchie

默认情况下标签不可聚焦。因此，我们可以在

tabIndex

中使用

ARIA:button

角色的帮助

<div text-center padding-bottom padding-top >
        <ion-chip class="chip chip-md" navPush="HelpPage"  [navParams]="account">
            <ion-label tabindex="0" role="button" class="md-help-text label label-md" >Forgot Your Password?</ion-label>
        </ion-chip>
    </div>

如果使用

role=“button”

而不是语义

或
元素（如
label
），它将使元素在屏幕阅读器中显示为按钮控件，并且为了获得我们需要使用的焦点，
tabIndex

<div text-center padding-bottom padding-top >
        <ion-chip class="chip chip-md" navPush="HelpPage"  [navParams]="account">
            <ion-label tabindex="0" role="button" class="md-help-text label label-md" >Forgot Your Password?</ion-label>
        </ion-chip>
    </div>


忘记密码了？

参考链接：

注：以上代码适用于我的键盘选项卡焦点访问以及屏幕阅读器

问题是很难说出
离子芯片
和
离子标签
的基本语义。如果离子标签“真的”是一个标签，那么它就是一个可操作的东西（可能是芯片，不管是什么）的标签。