html audio 在iPhone,ipd,safari浏览器不能播放是有原因滴
(在safri on ios里面明确指出等待用户的交互动作后才能播放media,也就是说如果你没有得到用户的action就播放的话就会被safri拦截)
找了很多资料都没有解决,不过最终在国外网站通过翻译解决问题,希望能帮到没有解决此问题的童鞋
附带源码如下:黑色部分表示重点突出
var g_audio = window.g_audio = new Audio(); //创建一个audio播放器
var g_event = window.g_event =new function(){
var events = ['load','abort','canplay','canplaythrough',
'durationchange','emptied','ended','error',
'loadeddata','loadedmetadata','loadstart',
'pause','play','playing','progress',
'ratechange','seeked','seeking','stalled',
'suspend','timeupdate','volumechange','waiting', 'mediachange'];
g_audio.loop = false;
g_audio.autoplay = true;
g_audio.isLoadedmetadata = false;
g_audio.touchstart = true;
g_audio.audio = true;
g_audio.elems = {};
g_audio.isSupportAudio = function(type){
type=type||"audio/mpeg";
try{
var r=g_audio.canPlayType(type);
return g_audio.canPlayType&&(r=="maybe"||r=="probably")
}catch(e){return false;}
};
g_audio.push = function(meta){
g_audio.previousId = g_audio.id;
g_audio.id = meta.song_id;
g_audio.previousSrc = g_audio.src;
g_audio.previousTime = 0.00;
g_audio.src = g_audio.currentSrc = meta.song_fileUrl;
g_audio.isLoadedmetadata = false;
g_audio.autobuffer = true;
g_audio.load();
g_audio.play();
if(g_audio.previousSrc !== g_audio.src){
g_audio.play();
}
};
for(var i = 0, l = events.length; i < l; i++){
(function(e){
var fs = [];
this[e] = function(fn){
if(typeof fn!== 'function'){
for (var k = 0; k<fs.length; k++){
fs[k].apply(g_audio);
}
return ;
}
fs.push(fn);
g_audio.addEventListener(e, function(){
fn.apply(this);
});
};
}).apply(this, [events[i]]);
}
this.ended(function(){ //播放结束
});
this.load(function(){ //加载
this.pause();
this.play();
});
this.loadeddata(function(){
this.pause();
this.play();
});
this.loadedmetadata(function(){
this.isLoadedmetadata = true;
});
this.error(function(){ //请求资源时遇到错误
});
this.pause(function(){ //歌曲暂停播放
});
this.play(function(){ //歌曲播放
});
};
$(document).ready(function(){
if(/i(Phone|P(o|a)d)/.test(navigator.userAgent)){
$(document).one('touchstart', function (e) {
g_audio.touchstart = true;
g_audio.play();
g_audio.pause();
return false;
});
}
});
audio使用:
$("#main").unbind("click").bind("click",function(){
//gid 表示歌曲id,只是一个表示,没有值不影响播放
//song_fileUrl :播放歌曲地址,不能为空,有效地址
g_audio.elems["id"] = gid;
g_audio.push({song_id:gid,song_fileUrl:json.URL});
});//绑定事件
相关推荐
Ipd、iphone用oplayer在局域网内播放windows7电脑上视频.pdf
IPD流程管理(华为IPD实践完整版)共54页.pdf.zip
IPD5个DCP评审表(4p) IPD-DCP和TR各阶段评审要素表完整(模板)
华为IPD流程管理,华为IPD流程管理课件,华为IPD流程管理PPT
在IPD运作中,DCP评审共有5个,主要是业务决策是否要进入下一个阶段,从产品投资的角度进行评审。TR评审共有7个,主要是从技术的角度评审决策是否具有可实现性和技术领先性。本资源为您整理了DCP和TR评审各阶段的...
IPD5个DCP评审表要素文字版(5p) IPD-DCP和TR各阶段评审要素表完整(模板)
IPD流程操作指引手册
上传备份自己的资料平时学习用,关于IPD体系培训资料的PPT,版权作者所有,请勿随意使用,尊重版权!很好的IPD培训资料,华为用IPD很多年了,IPD体系值得很多人学习,IPD成套体系之一
IPD如何解决产品开发的典型问题.zip
华为公司力推的IPD项目任务书模版,内容非常全面,希望对大家有用。
方太IPD流程基础知识培训,方太IPD流程基础知识培训课件,方太IPD流程基础知识培训PPT
IPD项目管理方法
IPD-PDCP计划决策评审要素表 IPD-DCP和TR各阶段评审要素表完整(模板) IPD-PDCP计划决策评审要素表 IPD-DCP和TR各阶段评审要素表完整(模板)
华为IPD流程指南3.0
华为IPD流程PPT
IPD管理变革
华为IPD介绍
本资源包含两个文档,一般产品的开发过程,华为的IPD流程