كيف يمكنني الحصول على تحميل jQuery () قبل Fadeout/Fadein؟

Question

أرغب في إجراء مكالمة Ajax عبر jQuery Load () وبمجرد إرجاعها ، ثم تلاشى المحتوى القديم و fadein المحتوى الجديد. أريد أن أظل محتوى قديمًا حتى يتم استرداد المحتوى الجديد ، وعند هذه النقطة يتم تشغيل/In in.

استخدام:

$('#data').fadeOut('slow').load('/url/').fadeIn('slow');

يتلاشى المحتوى داخل وخارج ولحظات قليلة في وقت لاحق إرجاع مكالمة التحميل () ، وتحديثات البيانات ، لكن التلاشي قد اكتمل بالفعل.

Answer 1

استخدم عمليات الاسترجاعات للتحكم في ترتيب المكالمات.

var $data = $('#data');
$data.fadeOut('slow', function() { 
    $data.load('/url/', function() { 
        $data.fadeIn('slow'); 
    }); 
});

(ملاحظة: لست متأكدًا بنسبة 100 ٪ إذا كنت أستخدم var $data = ... و $data.doStuff() ستعمل فعليًا - إذا كان الأمر كذلك ، فإنه يوفر لك من الاضطرار إلى البحث عن Div في شجرة DOM في كل مرة ، ولكن إذا لم يكن كذلك ، فقط قم بإزالة السطر الأول واستخدامه $('#data') في كل مكان...

Answer 2

ترتبط المشكلة بحقيقة أن الوظائف الثلاثة ، Fadeout ، Load و Fadein غير متزامنة. تقبل كل وظيفة من الوظائف المذكورة أعلاه وسيطة رد الاتصال (وظيفة) والتي سيتم تشغيلها عند الانتهاء من الوظيفة. على سبيل المثال

$('#data').fadeOut(functionToRunWhenFadeOutIsComplete);

// إذا كنت قد حددت 'functionTorunWhenfadeOutisComplete' فسوف يتم تشغيله بعد انتهاء Fadeout.

مسلحًا بهذه المعرفة ، يمكنك الآن حل مشكلتك.

var fadeInData = function fadeInData() { $('#data').fadeIn(); }
var loadData = function loadData() { $('#data').load('url', fadeInData); }
$('#data').fadeOut(loadData);

بدلاً من ذلك ، يمكنك تحديد LoadData ، Fadeindata كوظائف مجهولة.