如何在输入上创建两个按钮，如Tab（下一个焦点）按键和Shift + Tab（上一个焦点）

Question

在Internet上2小时后搜索找不到我想要的内容。

这里是我的问题： 如何创建一个像“Tab键”和“Shift + Tab键”那样的按钮，它将焦点放在下一个输入文本或上一个和第一次按下时将会聚焦第一个输入。

是这样的：

<div class="inputs"> 
    <input type="text" tabindex="1"/> 
    <input type="text" tabindex="2" /> 
    <input type="text" tabindex="3" /> 
    <input type="text" tabindex="4" /> 
    <button>Tab(Go next input to Focus)</button> 
    <button>Shift + Tab (fo Previous input to focus)</button> 
</div> 

对不起糟糕表现，我的问题和英语

Answer 1

如果您先存储有focus成var比它的input真的很简单：

LIVE DEMO

var $curr; 
$('.inputs input').on('focus',function(){ 
    $curr = $(this); 
}); 
$('.prevTab, .nextTab').on('click', function(e){ 
    $curr[ $(this).hasClass("nextTab") ? "next" : "prev" ]('input').focus(); 
}); 

---

更位复杂线实际上做

$curr.prev('input').focus();或$curr.next('input').focus();取决于哪个按钮被使用简单的三元运算符逻辑点：

if .nextTab is clicked ["next"] will be used 
if .prevTab is clicked ["prev"] will be used 

考虑到符号

$curr["next"]() is the same as $curr.next() method 
$curr["prev"]() is the same as $curr.prev() method 

只使用了支架表示法。

比我们只是确保prev或next元素实际上是一个input使用：

('input').focus(); // and set the focus to it!