Geek asks and answers

HTML5 audio control stop button (as opposed to pause)

I have been absolutely everywhere (I think) and cannot find a way to trigger a stop event in the html5 audio controller. My audio controller has a playlist in which each track will play when it is selected, or cycle through each track to the next. The following button also works there.

My play / pause button is as follows:

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

I need a “Stop” button that stops the sound and returns to the beginning of the currently playing track. I was thinking about using the current playback position somehow, but I can't get around this.

I also tried this (adapted by advice here in another question), to no avail:

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

Any ideas?

+5
source
3

/ , :

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

, , .

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;
});

+2

If you want to stop the music and abort the download operation, you can use this code:

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

We use java here to change the src song and then put it back there! Difficult but hardworking

0
source

More articles:


All Articles