چرخش Tab بین عناصر فرم به صورت خودکار

چرخش Tab بین عناصر فرم به صورت خودکار

بعد از تکمیل کادر هاي متنی که تعداد کاراکترهاي مشخصی را می پذیرند می توانید کنترل (تمرکز) صفحه را به دیگر عناصر صفحه منتقل کنید.  براي این کار می توانیم از صفت maxlength در تگ هاي <input /> استفاده کنیم:

<input type=”text” maxlength=”4″ />

کاري که باید در اینجا انجام دهیم تشخیص وارد شدن حداکثر کاراکتر ها و فراخوانی متد focus() براي عنصر فرم بعدي است. براي این کار از تابعی به نام test استفاده می کنیم:

function test(oTextbox){
var oForm = oTextbox.form;
//make sure the textbox is not the last field in the form
if (oForm.elements[oForm.elements.length-1] != oTextbox
&& oTextbox.value.length == oTextbox.getAttribute(“maxlength”)) {
for (var i=0; i < oForm.elements.length; i++) {
if (oForm.elements[i] == oTextbox) {
for(var j=i+1; j < oForm.elements.length; j++) {
if (oForm.elements[j].type != “hidden”) {
oForm.elements[j].focus();
return;
}
}
return;
}
}
}
};

تابعی که ما نوشتیم باید بعد از هر بار وارد کردن کاراکتر داخل textbox فراخوانی می شود. براي اینکار از رویداد onKeyUp استفاده خواهیم کرد به صورت زیر:

<input type=’text’ maxlength=’4′ onKeyUp=’test(this)’ />

منبع : انجمن علمی مهندسی فناوری اطلاعات دانشگاه پیام تور مرکز اران و بید گل

برای اموزش های ویدیویی زبان جاوا اسکیریپت به بستر ویدیو های اموزشی بروید

بستر اموزش های ویدویی