آموزش زنجیره سازی جلوه های بصری-تنظیم چندیدن افکت

همراهان گرامی دراین بخش به آموزش زنجیره سازی جلوه های بصری-تنظیم چندیدن افکت میپردازیم .

زنجیره سازی جلوه های بصری (تنظیم چندیدن افکت)

با jQuery می توان عملیات/متدها را به هم مانند زنجیر متصل کرد.

Chaining به شما این امکان را می دهد تا چندین متد را در تنها یک دستور به طور همزمان و بر روی یک المان اجرا کنید.

تاکنون دستورات jQuery را به صورت تکی می نوشتیم که یکی پس از دیگر اجرا می شدند. اما جالب است بدانید که روشی وجود دارد به نام “زنجیره ای کردن” (chaining) که این قابلیت را به برنامه نویس می دهد تا طی تنها یک دستور، چندین عملیات را روی یک عنصر معین اجرا کند.

توجه

بدین ترتیب، برای اعمال کارهای مختلف، مرورگرها مجبور نیستند که عنصرهای یکسان را بیش از یک مرتبه شناسایی کنند.

برای زنجیره ای کردن کارها، کافی است عملیات مد نظر خویش را به عملیات قبلی متصل کنید.

در نمونه ی زیر مشاهده می کنید که متدهای ()css و ()slideUp و ()slideDown بهم متصل شده اند. عنصر دارای شناسه ی “p1” ابتدا به رنگ قرمز تغییر یافته، سپس به صورت کشویی پنهان می شود و سرانجام به صورت کشویی بار دیگر نمایان می گردد:

نمونه یک
?
۱
۲
۳
۴
۵
۶
۷

$(document).ready(function () {
$(“button”).click(function () {
$(“#p1”).css(“color”, “red”).slideUp(2000).slideDown(2000);
});
});

در صورت نیاز می توانستیم دستورات بیشتری اضافه کنیم.

نکته

ممکن است در صورت استفاده از تکنیک زنجیره سازی با یک خط کد بسیار طولانی مواجه شویم. کتابخانه ی jQuery توجه بسیار زیادی به ساختار نگارشی ندارد و شما می توانید بنا به میل خود آن را قالب بندی کرده و بنویسید (برای مثال می توان هر دستور در یک خط جدا و یا همه ی دستورات را در یک خط طولانی نوشت). می توانید line breakها و تورفتگی ها را به صورت دلخواه مدیریت کنید.

نمونه دو
?
۱
۲
۳
۴
۵
۶
۷
۸
۹

$(document).ready(function () {
$(“button”).click(function () {
$(“#p1”).css(“color”, “red”)
.slideUp(2000)
.slideDown(2000);
});
});

jQuery فاصله های اضافی را نادیده گرفته و تمامی خط های فوق را به عنوان یک کد طولانی در نظر می گیرد و سپس اجرا می کند.