Javascript 如何使用相同的类(jQuery)从一个输入跳到下一个输入

Javascript 如何使用相同的类(jQuery)从一个输入跳到下一个输入,javascript,jquery,forms,filtering,Javascript,Jquery,Forms,Filtering,我正在寻找一种方法,从一个输入跳转到同一类的下一个输入。表单中的输入应该相互链接(不是全部,而是部分)。如果布局很简单,这可以很容易地完成,但是布局可以而且将会改变,因此很难执行类似parent()->next()的操作。因此,如何在表单/布局中找到具有相同类的下一个输入,而不返回到第一个元素(不希望循环它们) 表单代码(示例只是给您一个想法) jQuerynext()允许您传入选择器-这将限制它仅用于您想要的类,而不会返回到开头。我能想到的最简单的方法是: $('form').on('keyp

我正在寻找一种方法,从一个输入跳转到同一类的下一个输入。表单中的输入应该相互链接(不是全部,而是部分)。如果布局很简单,这可以很容易地完成,但是布局可以而且将会改变,因此很难执行类似parent()->next()的操作。因此,如何在表单/布局中找到具有相同类的下一个输入,而不返回到第一个元素(不希望循环它们)

表单代码(示例只是给您一个想法)


jQuery
next()
允许您传入选择器-这将限制它仅用于您想要的类,而不会返回到开头。

我能想到的最简单的方法是:

$('form').on('keypress','input',function(e){
    var eClassName = this.className,
        index = $(this).index('.' + eClassName) + 1;
    if (e.which === 13){
        e.preventDefault();
        $('input.' + eClassName)
            .eq(index)
            .focus();
    }
});​

这假设您希望按Enter键移动到同一类的下一个
输入。而且,元素只有一个类

参考资料:


请添加一些您正在使用的html。
。next
将选择下一个同级当且仅当它与选择器匹配时。next不能沿DOM向上移动。我添加了一个布局示例。谢谢,我没看到那部分。在这种情况下,David的解决方案是很好的—您甚至可以通过提前为该特定类的所有元素编制索引并遍历存储的数组来优化它。@user759235:不客气!但是请看修改后的代码(在我使用的
index()
的原始版本中,我应该使用
eq()
,我刚刚更正了它)。。。哎呀=/谢谢,我确实收到了一个错误,但是.eq()修复了它,非常感谢我今天学到了一些新东西!!是 啊这正是我得到的,我有点不好意思,我花了这么长时间才记住
index()
返回索引而不设置索引。唉,还是遇到了getter/setter问题…=)我们都会犯错误,那就是生活,但最重要的是你已经解决了我的问题;-)
$('form').on('keypress','input',function(e){
    var eClassName = this.className,
        index = $(this).index('.' + eClassName) + 1;
    if (e.which === 13){
        e.preventDefault();
        $('input.' + eClassName)
            .eq(index)
            .focus();
    }
});​