web-dev-qa-db-ja.com

オーディオを再生し、クリック時に再起動します

HTML5オーディオプレーヤーでオーディオファイルを再起動したいと考えています。オーディオファイルとplayボタンを定義しました。

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

playボタンをクリックすると、オーディオファイルの再生が開始されますが、もう一度ボタンをクリックすると、オーディオファイルは停止せず、ファイルの最後に到達するまで再生されません。

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

曲の停止を待つのではなく、onclickを使用してボタンをクリックしたときにオーディオファイルを再起動できる方法はありますか？

javascripthtmlaudioonclick
16
user2340767

曲を再開するには、次のようにします。

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

[〜＃〜]フィドル[〜＃〜]

それを切り替えるには、もう一度クリックするとオーディオが停止し、もう一度クリックすると最初から再開するので、次のようなことをします。

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

[〜＃〜]フィドル[〜＃〜]

36
adeneo
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");

}）;

1
Deepti Gehlot