1

我想在一个网站上使用这个很棒的小音频播放器：http ://www.brianhadaway.com/html5-audio-player-with-flash-fallback/

它在 HTML5 中对我来说很好用：http: //carolineelisa.com/audiotest/

但是，当我强制使用 Flash 播放器时（var isFlash = true;在http://carolineelisa.com/audiotest2/js/jquery.audiocontrol.js中），我在第一次加载时收到 File not found 错误：http: //carolineelisa.com/音频测试2/

之后该按钮将起作用，因此可能由于 Flash 播放器未准备好，以下操作不起作用？

$(document).ready(function(){
$(this).audiocontrol();
$(‘.audioButton’).click();
});

在“单击”按钮之前等待 Flash 播放器的任何提示（如果这确实是问题所在）将非常棒。谢谢！

4

1 回答 1

0

请注意 jquery.audiocontrol.js 中的这两行。

91. addListeners(window);
92. audio.playFlash(currentTrack + options.defaultMediaExtension);

在addListeners函数中添加了三个用于 html5 音频的事件处理程序，但这里的窗口被传递给该函数。结果，事件侦听器正在为窗口添加。然后audio.playFlash会导致错误，因为播放器没有像您提到的那样准备好。但是这个错误会调用onError函数，它会显示为 html5audio 元素编写的错误消息。

编辑：我进一步探索了代码，发现它正在发生是因为索引页面中的以下代码，第 12 行

$(document).ready(function(){
    $(this).audiocontrol();
    $('.audioButton').click();
});

触发 click 事件会立即播放音频，这仅适用于 html5 音频。嵌入 swf 需要几秒钟，因为 swfobject.js 是动态加载的。所以这段代码应该像

$(document).ready(function(){
    $(this).audiocontrol( { readyCallback:function(){ $('.audioButton').click();  } } );
});

在 jquery.audiocontrol.js 中，在第 125 行之后添加（用于 html5 音频）

if(options.readyCallback){
    options.readyCallback.call();
}

在第 136 行，将其作为 embedSWF 的回调函数传递。embedSWF 的最后一个参数是一个回调函数，它将在 SWF 准备好时调用，

swfobject.embedSWF(options.flashAudioPlayerPath, options.playerContainer, 
                 "0", "0", "9.0.0", "swf/expressInstall.swf", false, false, 
                 {id:options.flashObjectID}, options.readyCallback);

编辑：不知道为什么即使在准备好回调后外部接口函数也不可用。我怀疑它是因为 0 宽度和 0 高度。无论如何，给出下面给出的函数 loadFlash（第 141 行）解决了这个问题。它现在工作。

function loadFlash() {
    swfobject.embedSWF(options.flashAudioPlayerPath, options.playerContainer, 
             "1", "1", "9.0.0", "swf/expressInstall.swf", false, false, 
             {id:options.flashObjectID}, 
             function(){
        if(options.readyCallback){
            setTimeout(options.readyCallback, 150);
        }
});

}
于 2011-12-19T22:39:04.403 回答