جهش یافتن به فیلد بعدی فرم به محض رسیدن به حداکثر ظرفیت در jQuery

[sitedesignali 0]

لینک ها تنها برای اعضای سایت قابل نمایش است.

 

 

زمانی در فرم لازم است که پس از درج فیلد و رسیدن فیلد به حداکثر ظرفیت (maxlength) تعریف شده آن نشانه گر به صورت اتوماتیک به فیلد بعدی انتقال یابد تا کاربر بتواند به راحتی فرم را تکمیل نماید. به عنوان مثال فرمی را در نظر بگیرید که در آن فیلدهایی برای گرفتن شماره تلفن و موبایل موجود است و به صورتی تعبیه گردیده که در آن کاربر در هر فیلد یک شماره را وارد می نماید. بهتر است برای کاربر پسند بودن فرم به گونه ای طراحی گردد که پس از درج یک شماره از یک فیلد نشانه گر به صورت اتوماتیک به شماره بعدی انتقال پیدا نماید تا لازم نباشد کاربر به صورت دستی این کار را انجام دهد. در این مقاله به شما نحوه جهش به فیلد فرم بعدی به محض رسیدن به حداکثر ظرفیت را با استفاده از JQuery آموزش خواهم داد.

در ابتدا می بایست کتابخانه Jquery را به لیست کتابخانه های صفحه وب سایت خود اضافه نمایید البته در صورتی که قبلا این کار را انجام نداده اید. می توانید این کتابخانه را از آدرس لینک ها تنها برای اعضای سایت قابل نمایش است. دانلود نمایید:

<script src="jquery.min.js" type="text/javascript"></script>

 

 

سپس می بایست پلاگین مخصوص این را را در آدرس لینک ها تنها برای اعضای سایت قابل نمایش است. دانلود نموده و این پلاگین را نیز به کتابخانه های جاوا اسکریپت صفحه وب سایت خود اضافه نمایید.

<script type="text/javascript" src="jquery.autotab.js"></script>

 

 

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

<script type="text/javascript">

$(document).ready(function() {

$('#first').autotab({ target: '#second', format: 'numeric' });

$('#second').autotab({ target: '#third', format: 'numeric', previous: '#first' });

$('#third').autotab({ previous: '#second', format: 'numeric' });

});

</script>

 

 

که در مثال بالا می بایست مشخصه فیلد اول را در بخش اول هر سطر و مشخصه فیلدی که قصد دارید جهش به آن انجام گردد را در بخش دوم وارد نمایید. این کد زمانی که هر فیلد به حداکثر ظرفیتی که در هر کدام از فیلدها با تک maxlength مشخص نموده اید می رسد نشانه گر را به صورت اتوماتیک به فیلد بعدی انتقال می دهد.

سورس و آدرس:طراحی سایت دارکوب sitedesign.joomir.com

لینک ها تنها برای اعضای سایت قابل نمایش است.

 

لینک ها تنها برای اعضای سایت قابل نمایش است.

 

موضوعات:

 

 

 

لینک ها تنها برای اعضای سایت قابل نمایش است.

 

لینک ها تنها برای اعضای سایت قابل نمایش است.

 

لینک ها تنها برای اعضای سایت قابل نمایش است.

 

لینک ها تنها برای اعضای سایت قابل نمایش است.

 

لینک ها تنها برای اعضای سایت قابل نمایش است.

 

 

 

 

 

[laruz 983]

دستتون درد نکنه واقعا