在一个HTML表单(由Reaction生成，但这并不相关)中，我有一个带有标签的复选框.复选框处于隐藏状态(不可见)，选中/取消选中的方法是单击标签.目前，我已经设置了tabindex，以便标签在前一个表单控件之后成为焦点.然而，我找不到一种方法来让用户仅使用键盘选中/取消选中该复选框，即使标签处于焦点位置.有谁知道怎么做吗？基本上，我希望有一种方法来实现使用only the keyboard，这通常是clicking the label通过鼠标选中/取消选中复选框来完成的.
以下是我使用的代码的基本思想:
注意:我已经添加了一个小的js代码片段，用于在更改复选框时将复选框的状态记录到控制台.
document.getElementById("hidden-checkbox").onchange = function () {
console.log(document.getElementById("hidden-checkbox").checked);
}#hidden-checkbox {
display: none;
/* Could also use:
position: absolute;
clip: rect(1px, 1px, 1px, 1px);
padding: 0;
border: 0;
height: 1px;
width: 1px;
overflow: hidden;
*/
}<div class="fields">
<input type="text" id="other-field" tabindex="1">
<input type="text" id="other-field-2" tabindex="2">
<input type="checkbox" id="hidden-checkbox" tabindex="-1">
<label id="label" for="hidden-checkbox" tabindex="3">Click this to toggle!</label>
</div>