Javascript 将字符插入输入文本框时的制表符光标

下面是一个js fiddle示例：

HTML:

从js提琴可以看出，当用户从键盘输入一个字母时，光标选项卡指向下一个空白的输入文本框。当用户单击字符按钮并将其插入文本框时，如何复制相同的行为（切换到下一个空白）

---

如何使它成为下一个空白的对焦框？您可以尝试以下方法。它只是迭代，直到next（）元素为空，或者不再是输入元素。

<input type="text" maxlength="1" size="1" />
<input type="text" maxlength="1" size="1" />
<input type="text" maxlength="1" value="e" tabindex="-1" size="1" readonly />
<input type="text" maxlength="1" size="1" />
<input type="text" maxlength="1" value="r" tabindex="-1" size="1" readonly />
<input type="text" maxlength="1" size="1" />

<div>
<button class="buttons">á</button>
<button class="buttons">é</button>
<button class="buttons">í</button>
<button class="buttons">ó</button>
<button class="buttons">ú</button>
<button class="buttons">ñ</button>
<button class="buttons">ü</button>
</div>

$("input").bind("input", function () {
    var $this = $(this);
    if ($this.val().length >= parseInt($this.attr("maxlength"), 10)) {
        var nextEmpty = $this.nextAll("input[value=''], input:not([value])")[0];
        if (nextEmpty) {
            nextEmpty.focus();
        }
    }
});

$('input').focus(function(){
        $(this).addClass('active').siblings('.active').removeClass('active')
});

    $(".buttons").click(function () {
        var cntrl = $(this).html();
        $('input.active').val(cntrl);
    });

$('input.active').next().focus();