javascript - あるテキストボックスから別のテキストボックスにカーソルを自動的に移動する

Question

パスキーを検証し、いくつかの値を表示する Web アプリケーションを作成しています ファイルを入力するための 4 つのパスキーがあります 検証します。ペイメント ゲートウェイでクレジット カード番号を入力するのと同じようにパスキーを入力します。私の現在のアプリケーションでは、パスキーを 1 つ入力してから Tab キーを押すか、マウスを使用して、次のテキスト ボックスを選択して次のパスキーを入力する必要があります。最大値の後に、マウス カーソルをあるテキスト ボックスから別のテキスト ボックスに自動的にジャンプさせるにはどうすればよいですか支払いゲートウェイのように記入

Answer 1

次のように純粋な JavaScript を実行できます。

<script type="text/javascript">
function ValidatePassKey(tb) {
  if (tb.TextLength >= 4)
    document.getElementById(tb.id + 1).focus();
  }
}
</script>

<input id="1" type="text" onchange="ValidatePassKey(this)" maxlength="4">
<input id="2" type="text" onchange="ValidatePassKey(this)" maxlength="4">
<input id="3" type="text" onchange="ValidatePassKey(this)" maxlength="4">
<input id="4" type="text" maxlength="4">

Answer 2

ディレクティブを作成して、位置を移動することもできます

<a href="https://plnkr.co/edit/G6sFMM9vaR6nQfVaMI2E?p=preview">directive 1</a>

<a href="https://plnkr.co/edit/G32KUITspNp1qsq6gleI?p=preview">directive 2</a>