javascript - 表单内输入字段的循环焦点

Question

<form>
    <input tabindex="1" required>
    <input tabindex="2" required>
    <input>
    <input tabindex="3" required>
    <input>
    <input tabindex="4" required>
    <input tabindex="5" required>
    <button type="button" tabindex="6"></button>
    <button type="submit" tabindex="7"></button>
</form>

这里我有一个表单，其中包含一些输入字段和表单末尾的两个按钮...我正在使用tabindex 属性 focus 它们按顺序...现在按下 tab 键我需要聚焦 first input 字段在提交按钮释放焦点之后使用tabindex="1"，就像表单焦点输入字段一样从tabindex="2" 的输入字段释放焦点 后tabindex="3"...我该怎么做...？ ？

请不要使用任何 jQuery...仅使用 javascript 或 html...

Answer 1

Black Cobra 的答案是有效的，除非您将 id 属性用于某些东西(我就是这样)。不过，很容易编辑他的代码以供任何人使用:

<form>
    <input tabindex="2" autofocus required>
    <input tabindex="3" required>
    <input>
    <input tabindex="4" required>
    <input>
    <input tabindex="5" required>
    <input tabindex="6" required>
    <button type="button" tabindex="7"></button>
    <button type="submit" tabindex="8" id=""
            onFocus="this.tabIndex=1;"
            onBlur="this.tabIndex=8;">
    </button>
</form>

我刚刚改变了这个:

        onFocus="this.id=this.tabIndex;this.tabIndex=1"
        onBlur="this.tabIndex=this.id">

为此:

        onFocus="this.tabIndex=1;"
        onBlur="this.tabIndex=8;">

它不是动态的，但它真的很容易。如果你想要动态，see here.