2 つの API をロードする必要があります。ロード時に呼び出される YouTube api とonYouTubePlayerReady
、ロード時に呼び出される SoundManager 用の別の api soundManager.onready(...)
。サイトを準備するために、これらの各ready
機能で多くのことを行います。ただし、両方を完全にロードする必要がある初期化をさらに実行できるように、両方がいつ完了したかを知る必要もあります。これらのready
関数の両方が呼び出されたときに呼び出される関数を持つ方法はありますか?
6 に答える
両方にコールバックを使用します。
var callback = (function(){
var count = 0;
return function(){
count++;
if(count === 2){
//both ran and do something
}
}
})();
次に、両方のオンロードの最後に次のようにします。
callback();
if ステートメントの内容は、この関数が 2 回目に呼び出されたときにのみ実行されます。
小さなフィドルのデモ: http://jsfiddle.net/maniator/2X8rF/
Defered にはおそらくもっと良い方法がありますが、これは簡単でうまくいくはずです。ロードされたものとロードされなかったものを追跡するだけです。
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();
}
jQuery deferredを使用すると、準備が整った関数ごとに promise を作成し、それらを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');
});
そして、これらのコールバックをシミュレートする Fiddle http://jsfiddle.net/nikoshr/hCznB/
いくつかのフラグを設定するだけです:
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();
}
jQuery を使用している場合は、deferred を参照してください。
http://www.erichynds.com/jquery/using-deferreds-in-jquery/
http://api.jquery.com/category/deferred-object/
ありがとう
両方のreadys
ブール値をtrueに設定してから、それらに対してテストすることができます$(document).ready(function () { if (youTube === true && soundManager === true) { // Do stuff }});