Tabbing导航无法在表单中工作

Question

所以我正在开发一个项目，其中我有一个表单，有一些步进字段和文本字段。我遇到的问题是，当我点击其中一个字段中的标签按钮时，焦点不会更改为下一个字段。我已经尝试为字段设置标签索引，但这似乎没有帮助。

我有一种感觉问题是表单中的每个字段都包含在一些DIV中，如下所示：

<div class="form_class">
  <div class="field_class">
    <div class="input-group">
      <span class="input-group-addon">$</span>
      <div class="fg-line p-t-15">
        <input tabindex="0" class="form-control amount_field input-mask-amount" type="number" step="0.01">
      </div>
    </div>
  </div>
</div>

因此标签找不到DOM中的下一个字段，但我不知道如何解决这个问题。

非常感谢任何帮助。

Answer 1

根据您的评论，我会按顺序编写您的tabindex并添加一个按键事件处理程序。如果键是'tab'，则获取当前元素（document.activeElement），获取其tabindex，递增它，找到具有该新索引值的相应元素并手动聚焦。