Delay () و Fadeout () لا تؤخر attr () في قائمة الانتظار

Question

ما هو الخطأ في هذا الرمز؟ أحاول الحصول على هذا التأثير: fadeOut(500) و attr('class','myClass') تأخرت بمقدار 600 مللي ثانية .. ثم delay(600) مرة أخرى، و fadeIn(500). يحدث التأخير بشكل صحيح ولكن attr() لا يتأخر ، فهو يطلق النار عندما #myDiv لا يزال يتلاشى! : '(

$('#myDiv').fadeOut(500)
           .delay(600)
           .attr('class','myClass')
           .delay(600)
           .fadeIn(500);  

Answer 1

ال .delay() يؤثر فقط على الرسوم المتحركة أو fx قائمة الانتظار (ما لم تحدد قائمة انتظار مختلفة على وجه التحديد). ضع في اعتبارك أن التسلسل وقائمة الانتظار هما مفاهيمان مختلفتان بشكل واضح ، ويستمر التسلسل في استخدام نفس مجموعة jQuery ، لكن هذا شيء مختلف تمامًا عن أي قوائم قوائم أحداث على العناصر في تلك المجموعة.

للحصول على .attr() المكالمات المتأثرة ، عليك إضافته كاستدعاء إلى تلك قائمة الانتظار نفسها باستخدام .queue(), ، مثله:

$('#myDiv').fadeOut(500)
           .delay(600)
           .queue(function(next) { $(this).attr('class','myClass'); next(); })
           .delay(600)
           .fadeIn(500); 

لاحظ أيضًا أن هناك .addClass(), .removeClass() و .toggleClass() الطرق المتاحة التي قد تجعل هذا أكثر نظافة بعض الشيء :)