2013-10-05 194 views
0

开始做一些研究,为网站创建一个相当简单的媒体部分,我似乎遇到了一些问题。我会尽我所能解释。HTML5音频/ jQuery

我有一个'播放列表',它包含'links' - li元素atm - 利用Ajax/PHP将数据和负载拉入音频元素。我可以把数据拉好,没有问题。

但是我的问题出现在用户选择“轨道”时。

预期歌曲播放没有问题,但是如果用户选择同一首歌曲或不同的歌曲,则第一个“曲目”继续播放,而“新选定的”曲目开始播放。我基本上可以同时演奏10首曲目 - 相当烦人。

我试图阻止的第一首歌 - 无论是我破坏了音频标签或任何其它方法 - ,并播放新选择的歌曲当用户选择一个不同的“轨道”

我想我可以理解问题,我不断创建音频元素的新实例,而不会破坏初始实例。因此,想知道寻找任何以前发生的音频并在检测到这个事件并创建一个新音频时的最好方法。

下面是我测试的一些代码,目前这个脚本运行一次aJax回调=成功。

--COMMENTS 下面的代码是在jQuery的 音频= HTML5音频的情况下 arydata =包含从PHP脚本 --COMMENTS

我想到的是数据的数组,我需要增加下面的代码之前的一些代码运行以验证是否存在任何现有的音频元素,但我不知道这是否是最好的方法。

var audio = new Audio(); 
audio.src = arydata[1] + ".mp3"; 
audio.load(); 
audio.play(); 

让我知道,如果需要别的。

回答

0

找到了解决办法。

我错误地创建一个新的音频实例,每次用户选择一个轨道。

因此,要解决此问题,我在脚本加载时创建了音频实例。然后,一旦用户选择了一条音轨,我就可以找到Audio实例并将数据加载到它。

以下是代码。

var audio = new Audio(); 

$("#media_player_playlist_wrapper li").click(function(){ 
    var player = $(audio).get(0); 
    player.src = filepath; 
    player.load(); 
    player.play(); 
});