HTML5 音频控制停止按钮（与暂停相反）答案

【问题标题】：HTML5 audio control stop button (as opposed to pause)HTML5 音频控制停止按钮（与暂停相反）
【发布时间】：2012-05-18 13:45:58
【问题描述】：

我到处都是（我想），似乎找不到在 html5 音频控制器中调用停止事件的方法。我的音频控制器有一个播放列表，其中每个曲目将在选择时播放或循环播放每个曲目到下一个曲目。还有一个可以使用的下一步按钮。

我的播放/暂停按钮如下所示：

function playPause() {
    var audioPlayer = document.getElementsByTagName('audio')[0];
    if(audioPlayer!=undefined) {
        if (audioPlayer.paused) {
            audioPlayer.play();
        } else {
            audioPlayer.pause();
        }
    } else {
        loadPlayer();
    }
}

我需要一个“停止”按钮来停止音频并返回到当前正在播放的曲目的开头。我想过以某种方式使用当前播放位置，但无法理解。

我也试过这个（根据另一个问题的建议改编），但无济于事：

function stop() {
    var audioPlayer = document.getElementsByTagName('audio');
    addEventListener('loadedmetadata', function() {
        this.currentTime = 0;
    }, false);
}

有什么想法吗？

【问题讨论】：

标签： html controller html5-audio

【解决方案1】：

如果您的播放/暂停工作正常，这应该适用于停止：

function stop() {
    var audioPlayer = document.getElementsByTagName('audio')[0];
    audioPlayer.pause();
    audioPlayer.currentTime = 0;
}

【讨论】：

确实如此，完美！我必须在标记名之后添加[0] 才能让它与我的播放列表一起使用。谢谢！（抱歉，我无法以我可怜的 1 分来投票。）
@yolise 是的，抱歉，getElementsByTagName 返回一个列表。我会投票支持你的问题，这会有所帮助;)

【解决方案2】：

这是一个小演示代码，您可以在其中播放、暂停和停止音频。

Live Demo

HTML

<input type="button" value="play" id="playBtn" />
<input type="button" value="pause" id="pauseBtn" />
<input type="button" value="stop" id="stopBtn" />

jQuery

var source = "http://www.giorgiosardo.com/HTML5/audio/audio/sample.mp3"
var audio = document.createElement("audio");
audio.src = source;

$("#playBtn").click(function () {
    audio.play();
});

$("#pauseBtn").click(function () {
    audio.pause();
});

$("#stopBtn").click(function () {
    audio.pause();
    audio.currentTime = 0;
});

Source

【讨论】：

【解决方案3】：

如果您想停止播放音乐并中止下载操作，您可以使用以下代码：

<button id="btnStop" onclick="player.src = ''; player.src = 'song.mp3';">Stop</button>

我们这里是用java改歌曲src然后放回去！棘手但有效

【讨论】：