9

实际上，我能够使用框架在整个页面中连续播放音乐而无需重新加载（我知道连续播放音乐不是一个好主意，但客户确实要求这样做，所以我别无选择）。这是我用于播放音乐的框架：

<body>
    <div id="player">
    <audio id="audio" controls="controls" autoplay="autoplay" loop="loop" style="width:150px;">
      <source src="martnalia05namoracomigo.ogg" type="audio/ogg" />
      <source src="martnalia05namoracomigo.mp3" type="audio/mp3" />
      <embed src="martnalia05namoracomigo.mp3" hidden="true" loop="TRUE" autostart="TRUE"></embed>
    </audio>
    </div>
</body>

我插入这首音乐只是为了测试，我想知道是否可以制作一个播放列表，是否可以通过其中的链接和跳过音乐的按钮通知当前正在播放的音乐，因为例子：

[player]
| button previous  | button to play/pause | button next
| name of the music (link to the page of the Album) | 
[end of player]

有什么建议么？

4

2 回答 2

1

您可能想要制作一个小型媒体播放器，如果是这样的话，有很多现成的脚本可以帮助您实现这一目标。（谷歌是你的朋友）。

如果您决定自己做这件事，这是我的想法，它们可能会帮助您朝着正确的方向前进。

var data = [{audiourl: "filename1.mp3", artisturl:"http://example.com",name:"Song name"},
            {audiourl: "filename1.mp3", artisturl:"http://example.com",name:"Song name"}];

某种数据结构来存储曲目的详细信息。

var audio = document.getElementById("audio");
audio.addEventListener('ended', playNext);

最后是某种处理曲目切换的功能

var currentTrack = 0;
function playNext(options){
    currentTrack++;
    if (currentTrack > data.length){
        currentTrack = 0;
    }
    var audiosrc = document.getElementById('embed_element_id') // or some other selector method
    audiosrc.src = data[currentTrack].audiourl;
    audiosrc.play();
}

我不完全确定 HTML5 音频规范，但我会假设它沿着这些思路。

希望这可以帮助

于 2012-10-02T14:16:57.413 回答
0

You're probably going to have to use a media player plugin. Try LeanBack Player:

http://leanbackplayer.com/ + http://leanbackplayer.com/player_extensions.html (XSPF Audio Playlist extension)

It's HTML5/CSS/JS with a Flash fallback option so you should be able to style it to suit your needs easily enough.

于 2012-09-21T14:50:44.760 回答