سلام وقتتون بخیر.
بنده دو سوال داشتم
1- اینکه چطور میتونم خاصیت یک div رو عوض کنم و اون رو مثل یک input کنم. یعنی موقعی که روی این div کلیک میشه یک پوینتر داخل div قرار بگیره و بشه داخلش تایپ کرد.
2- بعد از اینکه داخل این div تایپ کردیم. فقط تعداد محدودی کاراکتر بشه وارد این div کرد (مثلا 5 تا) و به محض اینکه این تعداد کاراکتر وارد شد. بصورت اتوماتیک وارد div بعدی شده و پوینتر div بعدی هم فعال شه. یه چیزی مثل اینپوتی که در درگاه بانک ها وجود داره و هر 4 عدد داخل یک box یا div قرار میگیره.
به این شکل باکس هارو داشته باشیم و به محض تایپ کردن 5 کاراکتر داخل باکس اول و به محض اینکه 5 کاراکتر نوشته شد، به باکس بعدی بریم و داخل این باکس هم بشه 5 کاراکتر نوشت و همینطور ادامه داشته باشه. ممنون میشم کمک کنید.
@hesammousavi
@mhyeganeh
@nimageneral
@bamdad
@endworld
@milad
@saman1111
@hosseinshirinegad98
@mehdisut
<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>
آیا مایل به ارسال نوتیفیکیشن و اخبار از طرف راکت هستید ؟