播放音频并重新启动它

时间:2013-07-14 03:39:55

标签: javascript html audio onclick

我正在寻找重新启动HTML5音频播放器中的音频文件。我已经定义了一个音频文件和一个play按钮。

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

当我单击play按钮时,音频文件开始播放,但是当我再次单击该按钮时,音频文件不会停止,直到它到达文件末尾才会再次播放。

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

当我使用onclick单击按钮而不是等待歌曲停止时,是否有一种方法可以让我重新启动音频文件?

3 个答案:

答案 0 :(得分:26)

要重新启动歌曲,您需要:

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

答案 1 :(得分:1)

mssql connector

})beginDelayedInit();

启动马并暂停当前在点击事件中播放的所有其他声音:

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

});

答案 2 :(得分:0)

function sound(src) {
    this.sound = document.createElement("audio");
    this.sound.src = src;
    this.sound.setAttribute("preload", "auto");
    this.sound.setAttribute("controls", "none");
    //this.sound.style.display = "none";
    document.body.appendChild(this.sound);
    this.play = function () {
        this.sound.play();
    }
    this.stop = function () {
        this.sound.pause();
        this.sound.currentTime = 0
    }
}

您可以使用/ above函数播放声音

 let mysound1 = new sound('xyz.mp3')
 mysound1.play()