Сообщите, когда в javascript завершены несколько событий onLoad.

Question

Мне нужно загрузить два apis. YouTube api, который вызывает onYouTubePlayerReady, когда он загружен, и еще один api для SoundManager, который вызывает soundManager.onready(...), когда он загружен. Я делаю много вещей в каждой из этих функций ready, чтобы подготовить сайт. Тем не менее, мне также нужно знать, когда оба экземпляра завершены, поэтому я могу сделать больше инициализации, которые требуют как полной загрузки. Любая идея, как вызвать функцию, вызываемую при вызове обеих этих функций ready?

Answer 1

Используйте обратный вызов для обоих из них.

var callback = (function(){ 

    var count = 0; 

    return function(){ 
     count++; 
     if(count === 2){ 
      //both ran and do something 
     } 
    } 

})(); 

Тогда в конце обоих onloads просто сделать:

callback(); 

вещи в том, что если оператор будет работать только на второй раз эту функцию я называется.

Малый скрипку демо: http://jsfiddle.net/maniator/2X8rF/

Answer 2

Просто установите пару флагов:

var aDone = false; 
var bDone = false; 

function whenADone(){ 
    // do your other stuff 

    aDone = true; 

    if(bDone) whenBothDone(); 
} 

function whenBDone(){ 
    // do your other stuff 

    bDone = true; 

    if(aDone) whenBothDone(); 
} 

Answer 3

Вы могли бы оба ваши readys установить логическое значение истинной тогда тест против тех а $(document).ready(function() { if (youTube === true && soundManager === true) { // Do stuff }});

Answer 4

Eсть вероятно, лучший способ с Defered's, но это просто и должно работать. Просто следите за тем, что загружено, а что нет.

var status = { 
    youtube: false, 
    sound: false 
}; 

var loaded = function() { 
    if (!status.youtube) return; 
    if (!status.sound) return; 

    // load stuff! 
}; 

var onYoutubePlayerReady = function() { 
    status.youtube = true; 
    loaded(); 
}; 

soundManager.onready = function() { 
    status.sound = true; 
    loaded(); 
} 

Answer 5

При использовании JQuery, взгляните на отложенный:

http://www.erichynds.com/jquery/using-deferreds-in-jquery/

http://api.jquery.com/category/deferred-object/

Благодаря

Answer 6

Использование jQuery deferred, вы могли бы построить обещания для каждой готовой функции и объединить их с jQuery.when, чтобы вызвать окончательное действие. Например

function promiseYoutube() { 
    var dfd = $.Deferred(); 
    window.onYoutubePlayerReady = function() { 
     console.log("Youtube"); 
     dfd.resolve(); 
    }; 
    return dfd.promise(); 
} 

function promiseSoundManager() { 
    var dfd = $.Deferred(); 
    window.soundManager.onready = function() { 
     console.log("SoundManager"); 
     dfd.resolve(); 
    }; 
    return dfd.promise(); 
} 

$.when(promiseYoutube(), promiseSoundManager()).then(function(){ 
    console.log('Youtube+SoundManager'); 
}); 

И скрипка имитирующей этих обратных вызовов http://jsfiddle.net/nikoshr/hCznB/