没有通过键盘关注表标签

Question

我无法专注于我的桌子而且我不确定我应该如何标记它以便它可以通过键盘访问。

 <table class="table table-bordered">
                <thead>
                    <tr>
                        <th scope="col" class="sortable" width="10%" (click)="onHeaderClick('id')"
                            [ngClass]="{'active': sortBy == 'id', 'ascending': sortOrder == 'asc', 'descending': sortOrder == 'desc'}">
                            Id
                        </th>
                        <th scope="col" class="sortable" width="50%" (click)="onHeaderClick('name')"
                            [ngClass]="{'active': sortBy == 'name', 'ascending': sortOrder == 'asc', 'descending': sortOrder == 'desc'}">
                            Name
                        </th>
                    </tr>
                </thead>
                <tbody>
                    <tr *ngFor="let student of studentList" (click)="selectedStudent(student)">
                        <td>
                            {{student.uId}}
                        </td>
                        <td>
                            <a (click)="profile(student)">{{student.fields.Name}}</a>
                        </td>
                    </tr>
                </tbody>
            </table>

Answer 1

您应该在表格标题单元格中使用button元素，而不是尝试使th元素本身具有交互性。

按钮旨在与所有优势互动并提供帮助用户使用它们。