Воспроизвести аудио и перезапустить его onclick

Я хочу перезапустить аудиофайл в аудиоплеере HTML5. Я определил аудиофайл и кнопку play.

<audio id="audio1" src="01.wav"></audio>
<button onClick="play()">Play</button>

Когда я нажимаю кнопку play, звуковой файл начинает воспроизводиться, но когда я снова нажимаю кнопку, звуковой файл не останавливается и не будет воспроизводиться снова, пока он не достигнет конца файла.

function play() {
    document.getElementById('audio1').play();
}

Есть ли способ, который позволил бы мне перезапустить аудиофайл, когда я нажимаю кнопку, используя onclick, а не ждать остановки песни?

Ответы

Ответ 1

Чтобы просто перезапустить песню, вы должны:

function play() {
    var audio = document.getElementById('audio1');
    if (audio.paused) {
        audio.play();
    }else{
        audio.currentTime = 0
    }
}

FIDDLE

Чтобы переключить его, как при звуке останавливается при повторном нажатии, и когда вы нажмете еще раз, когда он перезапустится с самого начала, вы сделаете что-то более похожее:

function play() {
    var audio = document.getElementById('audio1');
    if (audio.paused) {
        audio.play();
    }else{
        audio.pause();
        audio.currentTime = 0
    }
}

FIDDLE

Ответ 2

soundManager.setup({
preferFlash: false,
//, url: "swf/"
onready: function () {
    soundManager.createSound({
        url: [
            "http://www.html5rocks.com/en/tutorials/audio/quick/test.mp3", "http://www.html5rocks.com/en/tutorials/audio/quick/test.ogg"
        ],
        id: "music"
    });
    soundManager.createSound({
        url: [
            "http://www.w3schools.com/html/horse.mp3", 
        ],
        id: "horse"
    });
    soundManager.play("music"); 
}

}) beginDelayedInit();.

И чтобы запустить лошадь и приостановить все остальные звуки, которые сейчас играют в событии клика:

$("#horse").click(function () {
soundManager.stopAll();
soundManager.play("horse");

});