方式一:
<audio src="static/sound/happyBirthday.mp3" autoplay="autoplay" preload="auto" controls="controls"></audio>
或
<audio autoplay=......><source src="static/sound/happyBirthday.mp3"></audio>
autoplay自动播放,loop循环播放,preload预下载,controls显示播放器,不写controls标签会隐藏播放器。
audio 仅支持mp3,ogg,wav。
方式二:
<iframe frameborder="no" border="0" marginwidth="0" marginheight="0" width=298 height=52 src="static/sound/happyBirthday.mp3" hidden="true"></iframe>
frameborder播放器边框,hidden隐藏播放器。
方式三,显示播放器:
<video controls="controls" autoplay="autoplay" name="media"><source src="音乐" type="audio/mpeg"></video>
source 标签可以放在video 标签里面,即<video source src="音乐" ></video>
video仅支持MP4、WebM、Ogg。
方式四:
<embed type="video/wma" src="static/sound/happyBirthday.wma" autoplay="autoplay" loop="true" hidden="false"></embed>
注意:
- embed 的type要跟后面的源文件格式匹配。
- embed 支持多种多媒体格式,Midi、Wav、AIFF、AU、MP3、WMA等等,
- embed是借助flash插件进行播放的,结合的是最新adobe flash插件,
- <embed> 标签是 HTML 5 中的新标签。
- <embed> 后面没有/结尾。
方式五(没试成功):
<bgsound src="static/sound/happyBirthday.mp3" loop=-1/>
loop=2表示循环两次,loop=-1表示无限循环,bgsound 很多浏览器不兼容。
注意:
采用ogg文件比mp3加载速度快很多
例如<audio src="static/sound/happyBirthday.ogg" autoplay="autoplay" preload="auto"></audio>
src路径引用时要截取到webapp后
绝对路径是/wxapp/src/main/webapp/static/sound/happyBirthday.mp3(/wxapp是project名)
src="static/sound/happyBirthday.mp3"