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

Tab cursor when character inserted into input textbox

本文关键字：制表符 光标 文本 字符 插入 输入      更新时间：2023-09-26

下面是一个js-fiddle示例：

http://jsfiddle.net/4m5fg/158/

HTML:

<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>

JS:

$("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);
    });

从js fiddle中可以看出，当用户从键盘输入一个字母时，光标会制表到下一个空白输入文本框。当用户单击一个字符按钮并将其插入文本框时，我如何复制这种相同的行为（切换到下一个空白）。

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

小提琴

相关文章：