一个页面中有多个audio标签，其中一个播放结束后自动播放下一个，audio连续播放

最新推荐文章于 2025-03-26 21:22:37 发布

mengke.me

最新推荐文章于 2025-03-26 21:22:37 发布

阅读量1.2w

点赞数 3

分类专栏：前端 # JavaScript

本文链接：https://blog.csdn.net/qq_17497931/article/details/81078271

版权

前端同时被 2 个专栏收录

40 篇文章

订阅专栏

JavaScript

17 篇文章

订阅专栏

本文介绍了一种使用JavaScript实现网页中多个音频文件按序自动播放的方法。通过为每个audio标签添加'ended'事件监听器，在当前音频播放结束后自动寻找并播放紧随其后的下一个音频文件。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

一个页面中有多个audio标签时，随机点击一个开始播放，当播放完成时自动播放下一个audio的音乐。

var audios = document.getElementsByTagName("audio");
for(var i=0;i<audios.length;i++){
	//console.log("audios "+i+"  SRC:" + audios[i].currentSrc);
	audios[i].addEventListener('ended', function () {
		var nextAudio = this.nextSibling.nextSibling;
		if(nextAudio.tagName == "AUDIO"){
			nextAudio.play();
		}
	}, false);
}