專注於選定類的下一個輸入，即使在使用jQuery的另一個類輸入上

Question

我無法在jQuery中找到正確的代碼。 我可以使用此代碼專注於'.first'類的下一個輸入。但是，如果我不在「.first」輸入上，它會轉到第一個「.first」輸入。

這是代碼片段：

var $first_elements = $('.section .first'); 
 
    var $inputs = $('input'); 
 
    $inputs.on('keyup', function(e) { 
 
     if (e.which === 13) { 
 
      var ind = $first_elements.index(this); 
 
      $first_elements.eq(ind + 1).focus() 
 
     } 
 
    });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
 
    <div class="section"> 
 
    <input class="first" name="input_1" /><input name="input_2" /><input name="input_3" /> 
 
    <br/> 
 
    <input class="first" name="input_4" /><input name="input_5" /><input name="input_6" /> 
 
    <br/> 
 
    <input class="first" name="input_7" /><input name="input_8" /><input name="input_9" /> 
 
    </div>

我怎麼可以去任何輸入.first選擇下一個輸入？

Answer 1

更新你這樣的代碼，綁定keyup事件僅適用於有答案類first

var $inputs = $('input'); 
 
$inputs.on('keyup', function(e) { 
 
    if (e.which === 13) { 
 
    $inputs.next('input.first').focus() 
 
    } 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<input class="first" name="input_1" /> 
 
<input name="input_2" /> 
 
<input name="input_3" /> 
 
<input class="first" name="input_4" /> 
 
<input name="input_5" /> 
 
<input name="input_6" />