HTML5 音频/jQuery

Question

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

我有一个“播放列表”，其中包含“链接”——li 元素 atm——它利用 aJax/PHP 来提取数据并加载到音频元素中。我可以很好地提取数据，没有问题。

但是，当用户选择“曲目”时，我的问题就出现了。

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

我正在尝试停止第一首歌曲——我破坏音频标签或任何其他方法——并在用户选择不同的“音轨”时播放新选择的歌曲

我想我可能理解这个问题，我不断创建新的音频元素实例而不破坏初始实例。因此，想知道查找任何先前出现的音频并在检测到时销毁该实例并创建一个新实例的最佳方法。

以下是我正在测试的一些代码，目前此脚本在 aJax 回调 = 成功后运行。

--评论 下面的代码是在 jQuery 音频 = HTML5 音频的实例 arydata = 包含来自 PHP 脚本的数据的数组 --评论

我在想，我需要在下面的代码运行之前添加一些代码来验证是否存在任何现有的音频元素，但我不确定这是否是最好的方法。

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

如果还需要什么，请告诉我。

Answer 1

找到了解决办法。

每次用户选择曲目时，我都会错误地创建一个新的音频实例。

因此，为了解决这个问题，我改为在脚本加载时创建音频实例。然后，一旦用户选择了一个音轨，我就会找到 Audio 实例并将数据加载到其中。

下面是代码。

    var audio = new Audio();

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