如何使用jQuery将焦点移动到下一个输入？

Question

我使用自动完成插件与jQuery,它工作正常.但是,在IE中,当用户选择自动完成中的项目时,焦点不会移动到下一个输入字段.当然它适用于Firefox.该插件没有内置解决方案,但确实提供了"选项".有没有办法可以强制它移动到下一个输入字段？

Answer 1

你可以这样做:

$("input").change(function() {
  var inputs = $(this).closest('form').find(':input');
  inputs.eq( inputs.index(this)+ 1 ).focus();
});

这里发布的其他答案可能不适合您,因为它们依赖于下一个输入是下一个兄弟元素,而事实并非如此.此方法前进到表单并搜索下一个输入类型元素.

Answer 2

JQuery UI已经有了这个,在我下面的例子中我包含了一个maxchar属性,专注于下一个可聚焦元素(输入,选择,文本区域,按钮和对象),如果我输入最大字符数

HTML:

text 1 <input type="text" value="" id="txt1" maxchar="5" /><br />
text 2 <input type="text" value="" id="txt2" maxchar="5" /><br />
checkbox 1 <input type="checkbox" value="" id="chk1" /><br />
checkbox 2 <input type="checkbox" value="" id="chk2" /><br />
dropdown 1 <select id="dd1" >
    <option value="1">1</option>
    <option value="1">2</option>
</select><br />
dropdown 2 <select id="dd2">
    <option value="1">1</option>
    <option value="1">2</option>
</select>

Javascript:

$(function() {
    var focusables = $(":focusable");   
    focusables.keyup(function(e) {
        var maxchar = false;
        if ($(this).attr("maxchar")) {
            if ($(this).val().length >= $(this).attr("maxchar"))
                maxchar = true;
            }
        if (e.keyCode == 13 || maxchar) {
            var current = focusables.index(this),
                next = focusables.eq(current+1).length ? focusables.eq(current+1) : focusables.eq(0);
            next.focus();
        }
    });
});

Answer 3

Sam的意思是:

$('#myInput').focus(function(){
    $(this).next('input').focus();
})

Answer 4

尝试使用类似的东西:

            var inputs = $(this).closest('form').find(':focusable');
            inputs.eq(inputs.index(this) + 1).focus();

Answer 5

为什么不简单地将输入字段放在要跳转到id的位置并进行简单的聚焦

$("#newListField").focus();

Answer 6

您能发布一些 HTML 作为示例吗？

同时，试试这个：

$('#myInput').result(function(){
    $(this).next('input').focus();
})

这是未经测试的，所以可能需要一些调整。