HTML 5 - 播放小型mp3“内联”

时间:2012-01-02 18:16:12

标签: html5 audio mp3 playback

我想使用HTML 5音频支持播放mp3。 我试图使用音频标签,但现在我正在使用javascript。

我的“播放器”只是一个微小的播放图像,按下时播放音频(不是所有音频控制都有进展)。

我正在尝试使用javascript播放它。

function playmp3(url){
   var audioElement = document.createElement('audio');
   audioElement.setAttribute('src', url);
   audioElement.load();
   audioElement.play();
}

这是我的代码,但不起作用。单击作为“播放”按钮的图像时,它会执行。

Url是一个包含文件网址的字符串。

我正在测试最新版本的Chrome和FF。

1 个答案:

答案 0 :(得分:4)

在尝试播放mp3之前尝试侦听canplay事件。以下是如何执行此操作的示例:

function playmp3(url){
    var audioElement = document.createElement('audio');
    audioElement.setAttribute('src', url);
    audioElement.load();
    audioElement.addEventListener("canplay", function() {
        audioElement.play();
    });
}

当浏览器可以开始播放mp3时会触发canplay事件,但它并不能保证它可以播放mp3来完成。如果这不符合您的目的,您可以收听其他几个相关事件,例如loadeddatacanplaythrough