等待jPlayer在继续循环之前完成加载文件

我正在使用jQuery音频播放器'jPlayer'，我有一个循环创建了一些jPlayer独特实例，然后将点击'jPlayer play'分配给另一部分每个实例的文档..问题是jPlayer使用内部ready: function() {}来分配音频路径并加载文件..我需要等待这个函数完成后再继续循环。等待jPlayer在继续循环之前完成加载文件

伪代码是这样的：

for loop{ 

create jPlayer div; 

instantiate jPlayer and assign audio file in the ready(); // need to wait before continuing 

assign an on click event to play file; 
}

~~我相信这是关于使用队列，但我不知道如何实现它？非常感激任何的帮助！~~

来源

2010-09-25 greenimpala

您可以尝试这样的事：

function initPlayer(playerQueue){ 
    if(playerQueue.length > 0) { 
    var player = playerQueue.pop(); // get our options hash for this iteration 
    var container = $('<div id="'+player.container+'"></div>').appendTo('body'); 

    $(container).jPlayer({ 
     ready: function(){ 
     var _e = this.element; 
     _e.jPlayer('setFile', player.file); 
     var timer = setInterval(function(){ 
      if(_e.jPlayer('getData', 'diag.loadPercent') == 100){ 
       $(player.control).click(function(){ 
        // assign your handler 
       }); 
       clearInterval(timer); // clear the interval 
       initPlayer(playerQueue); // invoke the next player init 
      } 
     },500); 
     }, 
     /* ... other options ... */ 
    }); 
    } 
} 

initPlayer([ 
    {container: 'audio-1', file: 'uri/for/file', control: '#button-1'}, 
    {container: 'audio-2', file: 'uri/for/file', control: '#button-2'}, 
    {container: 'audio-3', file: 'uri/for/file', control: '#button-3'}, 
    {container: 'audio-4', file: 'uri/for/file', control: '#button-4'} 
]);

我们基本上摆脱了明确的循环，而是使用现成功能本身通过initPlayer功能，推进构建迭代。通过使用一个数组，我们可以使用pop()，它将得到数组的最后一个元素，同时将它从数组中移除。我们等待调用initPlayer，直到通过每500毫秒轮询播放器的负载百分比来获得100的负载百分比。

这只是一个建议，可能需要很多工作......我从来没有使用过jPlayer，而且我正在从文档中盲目飞行，所以不要期望它能够开箱即用:-)。

来源

2010-09-25 17:35:53 prodigitalson

你是绝对的天才！非常感谢，我真的很感激它，我不得不乱它一下，添加jPlayer（'load'）;在我们指定文件路径以实际加载它之后..并且jPlayer喜欢返回99.9999999而不是100，这很奇怪。我得到一个“Uncaught TypeError：不能每次读取未定义的属性'容器'（代码片段中的第4行）。尽管希望尽可能达到底线......再次感谢！（： – greenimpala 2010-09-25 20:34:55

hmm throw in'console.log（player）; console.log（playerQueue）;'在创建了'div'的行之前，在Firefox/Firebug中进行调试，并查看每个内容的错误。可能会解决这个问题，但是可以通过明确地将你的对象数组附加到'window'对象并将其明确地称为:-) – prodigitalson 2010-09-25 21:00:05

Ahh刚刚做了你说什么，出于某种原因我删除了if（playerQueue.length> 0）..所以它试图处理空数组。感谢那：）！！ – greenimpala 2010-09-25 21:44:21

等待jPlayer在继续循环之前完成加载文件

回答

相关问题