指定文字数を入力したら自動で次のフィールドへ移動させる

4桁打ったら自動で次のフィールドへフォーカスが移動するようにします。

<script type="text/javascript">
function nextField(i, n, m) {
  if (i.value.length >= m) {
    i.form.elements[n].focus();
  }
}
</script>
<input type="text" name="n1" style="width:4em;ime-mode:disabled;" maxlength="4" onKeyUp="nextField(this, 'n2', 4)">
 - 
<INPUT type="text" name="n2" style="width:4em;ime-mode:disabled;" maxlength="4" onKeyUp="nextField(this, 'n3', 4)">
 -
<INPUT type="text" name="n3" style="width:4em;ime-mode:disabled;" maxlength="4" onKeyUp="nextField(this, 'n4', 4)">
 -
<INPUT type="text" name="n4" style="width:4em;ime-mode:disabled;" maxlength="4">

クレジットカード番号入力フォームに利用したいと思い調べていたのですが、クレジットカード番号は必ずしも4-4-4-4の16桁ではないようです。Wikipedia：クレジットカードの番号

実際にこれを実装するには各カード会社のプレフィックスにより桁数を判別して振り分ける必要がありますね・・・。やっぱりjQueryプラグインなどを利用するのが一番簡単そうです。

参考：入力カーソルを自動的に次のフィールドへ移動する