一款跨浏览器的音频播放器，可惜例子和文档都比较少

英文文档 官网

使用方法：

第一步引用文件：

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

第二步，全局初始化：

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

第三步，在需要的地方放上下面类似的代码：

<audio src="/mp3/juicy.mp3" preload="auto" /> //注意是直接闭合标签

然后，然后就没有了，WTF！！！

以上只适用静态的页面，如果动态添加音频怎么办？相信好多人都需要这种功能，我也是，费了很大功夫才找到一个方法，如下：

http://stackoverflow.com/ques...

看不懂？没关系，提取有效代码如下：

var as;
audiojs.events.ready(function () {as = audiojs.createAll();
});
$(document).ready(function () {setTimeout(function () {var mp3 = "http://s3.amazonaws.com/audiojs/02-juicy-r.mp3"; // audio.js example// creating new audio element, yours is probably added via ajax// [0] used to get DOM element instead of jQuery object.var audio = $('<audio/>', {id: 'test'}).appendTo('body').attr('src', mp3)[0];var testAS = audiojs.create(audio); // initialise new audio.js playeras.push(testAS); // add "testAS" object to "as" array of objectsconsole.log(as); // log "as" - now holds the original objects + "testAS"}, 5000); // timeout used for testing, above code can be in ajax success function instead
});

控制HTML样式类名配置

createPlayer: {markup: '          <div class="headset"></div>             <div class="playname" id="playname"></div>             <div class="play-pause">             <p class="play"></p>             <p class="pause"></p>             <p class="loading"></p>             <p class="error"></p>           </div>           <div class="scrubber">             <div class="progress"></div>             <div class="loaded"></div><div class="words"> </div>           </div>           <div class="time">             <em class="played">00:00</em>/<strong class="duration">00:00</strong>           </div>           <div class="volume"></div>           <div class="error-message"></div>',playPauseClass: 'play-pause',scrubberClass: 'scrubber',progressClass: 'progress',loaderClass: 'loaded',timeClass: 'time',durationClass: 'duration',playedClass: 'played',volumeClass: 'volume',closingClass: 'closing',errorMessageClass: 'error-message',playingClass: 'playing',loadingClass: 'loading',errorClass: 'error'},