jQuery دادهها - متد jQuery.queue()
مثال
نمایش طول کویو:
function showIt() { var n = div.queue("fx"); $("span").text( n.length ); setTimeout(showIt, 100); }
تعریف و استفاده
متد queue() کویو فونکشنهایی که بر روی عناصر تطابق دارند را نمایش میدهد یا بر روی آنها عمل میکند.
توضیحات:این یک متد سطح پایین است؛ از .queue() بیشتر سادهتر است.
قانونگذاری
.queue(queueName)
پارامترها | شرح |
---|---|
queueName | اختیاری. مقدار متنی شامل نام توالی. |
عمل بر روی کویو
متد queue() کویو فونکشنهایی که بر روی عناصر تطابق دارند را عمل میکند.
قانونگذاری
.queue(queueName,newQueue)
پارامترها | شرح |
---|---|
queueName | اختیاری. مقدار متنی شامل نام توالی. |
شرح مفصل
هر ایلیمن میتواند یک یا چند فونکشن کویو (فریمورک جاوااسکریپت) داشته باشد. در بیشتر برنامهها، تنها از یک کویو استفاده میشود (به نام fx). کویو به صورت غیر موازی动作 توالیها را بر روی عناصر فراخوانی میکند و اجرای برنامه را متوقف نمیکند. مثالهای معمول فراخوانی چندین روش انیمیشن بر روی یک عنصر است. به عنوان مثال:
$('#foo').slideUp().fadeIn();
当这条语句执行时,元素会立即开始其滑动动画,但是淡入过渡被置于 fx 队列,只有当滑动过渡完成后才会被调用。
.queue() 方法允许我们直接对这个函数队列进行操作。调用带有回调函数的 .queue() 方法特别有用;它允许我们在队列末端放置一个新函数。
یہ خصوصیت انیمیشن طریقوں کو فراہم کرنے والی ریٹرن فنکشن کی طرح ہے، لیکن انیمیشن چلانے کے دوران ریٹرن فنکشن کو سے قائم نہیں کیا جاتا۔
$("#foo").slideUp(); $("#foo").queue(function() { alert('Animation complete.'); $(this).dequeue(); });;
ایک ساتھ:
$("#foo").slideUp(function() { alert('Animation complete.'); );
توجہ دیں، جب ہم .queue() کے ذریعے فنکشن کو اضافہ کرتے ہیں تو، ہم کو یقین دہانی کرنا چاہیے کہ آخری میں .dequeue() کو بھی بول دیا گیا ہے، تاکہ کوئئیو آپارتمان نمبر کو اگلے فنکشن کو چلایا جاسکے。
مثال 1
مخصوص فنکشن کو کوئئیو آپارتمان نمبر کو کار کریں:
$("(document.body)").click(function () { $("div").show("slow"); $("div").animate({left:'+=200'},2000); $("div").queue(function () { $(this).addClass("newcolor"); $(this).dequeue(); });; $("div").animate({left:'-=200'},500); $("div").queue(function () { $(this).removeClass("newcolor"); $(this).dequeue(); });; $("div").slideUp(); );
مثال 2
کوئئیو آپارتمان نمبر کو ختم کرنے کے لئے سیٹ کریں:
$("#start").click(function () { $("div").show("slow"); $("div").animate({left:'+=200'},5000); $("div").queue(function () { $(this).addClass("newcolor"); $(this).dequeue(); ); $("div").animate({left:'-=200'},1500); $("div").queue(function () { $(this).removeClass("newcolor"); $(this).dequeue(); ); $("div").slideUp(); ); $("#stop").click(function () { $("div").queue("fx", []); $("div").stop(); );