JSFiddle - React, Tailwind, and code Playground

by Sergey Goryachev

HTML

<div>
    <input type="text" onkeyup="testJump(this);" maxlength="1" size="1">
    <input type="text" onkeyup="testJump(this);" maxlength="1" size="1">
    <input type="text" onkeyup="testJump(this);" maxlength="1" size="1">
    <input type="text" onkeyup="testJump(this);" maxlength="1" size="1">
</div>

JavaScript

function testJump(x){
    var ml = ~~x.getAttribute('maxlength');
    if(ml && x.value.length >= ml){
        do{
            x = x.nextSibling;
        }
        while(x && !(/text/.test(x.type)));
        if(x && /text/.test(x.type)){
            x.focus();
        }
    }
}