HTML5 audio 如何实现播放多个MP3音频

属性 描述
autoplay autoplay 添加该属性后,音频会自动播放
controls controls 设置后,显示控件,如播放按钮、音量
loop loop 添加该属性后,当音频播放结束后会重新开始播放
preload preload 音频显示页面加载,准备播放,如已添加autoplay,则忽略该属性
src url 播放音频的URL(地址)。

HTML5音频简单的使用实例如下

但有时候你的浏览器不支持.MP3格式播放,这时就需要设置兼容多个浏览器的格式了,如下

很多小白把上面理解为音频播放列表,按顺序播放(即播放完music.mp3后,自动播放下一个music.m4a)。html5设成多个src,主要是有的浏览器无法播放个别音频格式,它从上到下读取播放,如果第一个mp3格式能播放,后面的就没用了。

以前给网页、网站添加音乐播放列表时,都是用网易音乐、虾米音乐中的“生成外链播放器”来给网页添加音乐的,但过一段时间,你会发现你添加的音乐列表某首音乐不能播放了,主要原因是音乐版权问题。这时只能通过添加其他播放器或自己用代码来实现了。推荐阅读:网页如何嵌入腾讯/优酷视频播放器

目前,html5

通过js来实现

将上面代码的音频地址改成你的MP3地址即可,可在后面添加多个mp3音频地址。

以上代码效果显示地址:http://www.lmlblog.com/blog/bozhao/ 网站添加播放器的方法除了上面说到的网易云生成外链播放器、虾米播放器(制作地址http://www.xiami.com/widget/imulti)添加,还有很多,欢迎交流。

文章来源于http://www.lmlblog.com/405.html

转载于:https://www.cnblogs.com/lmlblogs/p/8732342.html

你可能感兴趣的:(HTML5 audio 如何实现播放多个MP3音频)