اینپوت درjs

<div class="container">
a: <input type="text" maxlength="5" />
b: <input type="text" maxlength="5" />
c: <input type="text" maxlength="5" />
</div>

<script>

    var container = document.getElementsByClassName("container")[0];
container.onkeyup = function(e) {
    var target = e.srcElement || e.target;
    var maxLength = parseInt(target.attributes["maxlength"].value, 10);
    var myLength = target.value.length;
    if (myLength >= maxLength) {
        var next = target;
        while (next = next.nextElementSibling) {
            if (next == null)
                break;
            if (next.tagName.toLowerCase() === "input") {
                next.focus();
                break;
            }
        }
    }

    else if (myLength === 0) {
        var previous = target;
        while (previous = previous.previousElementSibling) {
            if (previous == null)
                break;
            if (previous.tagName.toLowerCase() === "input") {
                previous.focus();
                break;
            }
        }
    }
}

    </script>

@bamdad
خیلی ممنونم از کمکتون. این کد برای max length و رفتن به اینپوت های بعدی بعد از پر شدن اینپوت بود که جواب یکی از سوالام گرفته شد.
یه سوال دیگم که گفتم خدمتتون این بود که چطور میشه من به جای این سه تا input سه تا div داشته باشم ولی این div ها خاصیت همون input ها رو داشته باشن.
چون من هدفم اینه که این div هارو همراه با (فقط) یه دونه input داخل یه form قرار بدم، بعد اطلاعاتی که داخل این div ها قرار میگیره رو push کنم توی value ی این input.

خواهش ، چیزی که میخواستی رو با Jquery برات نوشتم ، حوصله نداشتم با pure js بنویسم😂 ، شاید بهترم بشه نوشت این کد رو ، ولی این کارتو راه میندازه - اگه خواستی از jQ استفاده کنی ، یادت نره به پروژه ات اضافه کنی

<form>
 <div class="element" contenteditable>Salam1</div>
 <div class="element" contenteditable>Salam2</div>
 <div class="element" contenteditable>Salam3</div>
 <input  id="input_id" type="text" name="harchizi">

 <button onclick ="transfer()" type="submit" >button</button>
</form>

<script>

function transfer() {

var str ="";

 $(".element").each(function() {
    str = str + $(this).text() + " ";
 })
 $("input").attr("value",str);
 $('form').submit();
}
</script>

سلام div ها رو با این پروپرتی بنویس به محض اینکه روش کلیک کنی میشه توش تایپ کرد.بعداینکه از هر دیو بیرون اومدی رویداد کلیک رو برای دیو بعدی فعال کن تا قابل نوشتن بشه.

 <div contenteditable>
                </div>