今天做了一个页面，在音频列表上播放音频文件。
效果图如下：
实现原理如下：
function fnPlayAudio(obj, expr) {if(obj.hasClass("icon-play-stop")){ obj.removeClass("icon-play-stop"); $("#audioBox").html("");; }else{ expr.removeClass("icon-play-stop"); obj.addClass("icon-play-stop"); $("#audioBox").html("").append("<audio controls=‘controls‘ autoplay=‘autoplay‘ height=‘1‘ width=‘1‘ id=‘audioObj‘><source src=‘../images/"+ obj.attr(‘data-src‘)+".mp3‘ type=‘audio/mp3‘/></audio>"); } }
注：给audio写上autoplay 为true，以为安枕无忧了，可是在ios*问的时候，并没有自动播放。
查了资料，html audio
在iPhone，ipd,safari浏览器不能播放是有原因滴
(在safri on
ios里面明确指出等待用户的交互动作后才能播放media，也就是说如果你没有得到用户的action就播放的话就会被safri拦截
于是采用了更近办法，audio标签append到页面后，执行audio.play();
function fnPlayAudio(obj, expr) { var voice = document.getElementById("audioObj"); if(obj.hasClass("icon-play-stop")){ obj.removeClass("icon-play-stop"); $("#audioBox").html(""); voice.pause(); }else{ expr.removeClass("icon-play-stop"); obj.addClass("icon-play-stop"); $("#audioBox").html("").append("<audio controls=‘controls‘ autoplay=‘autoplay‘ height=‘1‘ width=‘1‘ id=‘audioObj‘><source src=‘../images/"+ obj.attr(‘data-src‘)+".mp3‘ type=‘audio/mp3‘/></audio>"); voice.play(); } }