сосредоточиться на следующем вводе не работает в jquery?

Question

Я хочу, чтобы мой jquery код сосредоточился на следующем вводе, но он не работает. Я хочу сосредоточиться на следующих полях ввода, как я могу этого добиться? вот мой код

function ok(elem){
   
    $(elem).next('input').focus();
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="row">
        <div class="input-field col s6">
          <input id="first" type="text" class="validate inputs" onkeyup="ok(this);">
          <label for="first">first</label>
        </div>
      </div>

       <div class="row">
        <div class="input-field col s6">
          <input id="second" type="text" class="validate inputs" onkeyup="ok(this);">
          <label for="second">first</label>
        </div>
      </div>

Answer 1

.next() работает, когда есть родственные отношения между тем, где вы находитесь, и тем, что вы хотите найти. В вашем случае вам необходимо выполнить резервное копирование до closest родительского row, а затем получить next родственную строку, а затем find ввод туда.

function ok(elem){
  // Locate the closest div with the row class that is an ancestor
  // of the current element. Then, get the next div with the row
  // class that is a sibling of that. And finally, find the input
  // that is in that next div.
  $(elem).closest("div.row").next('div.row').find("input").focus();
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="row">
  <div class="input-field col s6">
    <input id="first" type="text" class="validate inputs" onkeyup="ok(this);">
    <label for="first">first</label>
  </div>
</div>
<div class="row">
  <div class="input-field col s6">
    <input id="second" type="text" class="validate inputs" onkeyup="ok(this);">
    <label for="second">first</label>
  </div>
</div>