关于audio.js的研究

——杂言：audio.js结合使用html5的audio组件实现了音频的原位播放功能。虽然项目里已经使用一段时间了，不过我是最近才开始有所接触，惭愧。个人见解若有不对，请帮忙纠正，谢谢。

官方相关链接:

官网 docs github源码

 

基本使用步骤:

1.下载 audio.js ,  player-graphics.gif,   audiojs.swf

2.添加audio.js引用代码

<script src="/audiojs/audio.min.js"></script>

3.添加音频预览初始化js代码

<script>
audiojs.events.ready(function() {
   varas = audiojs.createAll();
});
</script>

4.在你需要播放的html页面中添加<audio>标签

<audio src="/mp3/juicy.mp3"preload="auto" />

 

我遇到的:

• Q1：绑定ajax出来的<audio>对象(存在的现象是：<audio>对象多次绑定时，播放事件失败)
• Q2：java的fileName和path的编码问题(针对中日文)
• Q3：关于preload跟加载的效果

 

解决方法:

• A1：这个我的处理方式是每个audio都检查下src是否相同，相同的则不重新绑定，否则视为新元素。绑定方法见上述步骤3。
• A2：java处理中日文字符串的乱码问题
• A3：preload="auto"表示页面载入时音频也同时开始缓冲；preload="none"表示用户点击播放按钮以后音频才开始载入，并缓冲，之后再播放。

 

这里有个注意点： IE(ie7, ie8, ie9, ie10, ie11), safari7.0.1下要求是本地资源，也就是url对应的资源必须是下载好的，不然会加载失败；

　　　　　　　　其他浏览器(firefox26.0, chrome31.0, opera12.15)，我目前测试，remoteUrl没问题。