如何播放HTML和JavaScript中的音频文件组？

Question

<html>
<body>
<audio autoplay id ="audio_1" src = "./Dusty.wav"></audio>
<audio loop id = "audio_2" src = "./Dusty3.wav"></audio>
<audio loop id = "audio_3" src = "./Dusty2.wav"></audio>
<!-- <input type = "button" value = "play" onClick="audiofun();" -->
</body>
<script>
// audiofun()
// {
    var audio = document.getElementById("audio_1");
    var audio2 = document.getElementById("audio_2");
    var audio3 = document.getElementById("audio_3");
    // audio2.pause();
    // audio3.pause();
    audio.addEventListener("ended", function () {audio2.play();})
    audio2.addEventListener("ended", function () {audio3.play();})


// }    
</script>
</html>

When I run this code audio2.play() is continuously playing and audio3.play is not at all playing. 当我运行此代码时，audio2.play（）一直在播放，而audio3.play根本不在播放。 can anyone put light on my error... thanks in advance 任何人都可以指出我的错误...在此先感谢

Answer 1

i feel like your problem comes from the property "loop" in your audio tag. 我觉得您的问题来自音频标签中的“循环”属性。 Maybe you should try: 也许您应该尝试：

<audio id = "audio_2" src = "./Dusty3.wav"></audio>
<audio id = "audio_3" src = "./Dusty2.wav"></audio>

And add a event listener on your first, then second audio. 并在第一个音频和第二个音频上添加事件监听器。

var audio = document.getElementById("audio_1");
var audio2 = document.getElementById("audio_2");
var audio3 = document.getElementById("audio_3");  
document.getElementById('audio_1').addEventListener('ended',audio_1Handler,false);
function audio_1Handler(e) {
    audio2.play();

}
document.getElementById('audio_2').addEventListener('ended',audio_2Handler,false);
function audio_2Handler(e) {
    audio3.play();

}

the snippet above is highly inspired of : this post 上面的代码段灵感来自：这篇文章

Hopefully this helps you. 希望这对您有帮助。 Feel free to ask any further questions ! 随时问任何其他问题！

如何播放HTML和JavaScript中的音频文件组？

问题描述

1 个解决方案

解决方案1
0 2017-06-15 19:10:34

如何播放HTML和JavaScript中的音频文件组？

问题描述

1 个解决方案

解决方案1 0 2017-06-15 19:10:34

解决方案1
0 2017-06-15 19:10:34