网页音乐在线播放器汇总问题

作者:佚名 来源:网络 点击数: 发布时间:2017年03月01日

一般我们网站后台通过的形式插入音乐播放文件,hidden:是否隐藏;autos tart:是否自动播放,loop:是否循环播放;这种虽然很简单,但存在一个浏览器兼容性的问题。下面的这张图在IE和火狐播放正常,但google上有很多黑边。

所以在html中插入音频文件,总结的一些问题(播放mp3文件):

1、 
问题:IE8上正常(通过media player插件来播放)但在IE6和IE7上不会播放 
Firefox上要安装QuickTime插件才能播放 
Chrome通过将其转化成html5上的 标签播放,能播放但会使整个屏幕蓝屏 
Opera不会自动播放 

2、 
问题:IE6,IE7上不会正常播放,IE8正常 
Firefox上正常 
Chrome上要求肮脏QuickTime插件才能正常播放 
Opera不会自动播放 

3、  
问题:在IE6,7上不能播放,IE8会弹出“非正常使用的Articx”等字样的提示 
Firefox上正常 
Chrome上正常 
Opera不支持 

4、 
问题:html5标签 仅Chrome支持 

 

5、  

 

6、 <bgsound src="">  
问题:IE6,IE7均不支持,其余浏览器均支持,Opera不能自动播放

 

综合以上可以采取了以下方式(jquery下执行):

if(navigator.userAgent.indexOf("Chrome") > -1){ 
如果是Chrome: 
 
}else if(navigator.userAgent.indexOf("Firefox")!=-1){ 
如果是Firefox: 
 
}else if(navigator.appName.indexOf("Microsoft Internet Explorer")!=-1 && document.all){ 
如果是IE(6,7,8): 
 
}else if(navigator.appName.indexOf("Opera")!=-1){ 
如果是Oprea: 
 
}else{ 
 

或者:

var ua = navigator.userAgent.toLowerCase(); 
if(ua.match(/msie ([d.]+)/)){ 
jQuery('#__alert_sound').html(''); 

else if(ua.match(/firefox/([d.]+)/)){ 
jQuery('#__alert_sound').html(''); 

else if(ua.match(/chrome/([d.]+)/)){ 
jQuery('#__alert_sound').html(' '); 

else if(ua.match(/opera.([d.]+)/)){ 
jQuery('#__alert_sound').html(' <bgsounds src="/sounds/alert/1.mp3"> '); 

else if(ua.match(/version/([d.]+).*safari/)){ 
jQuery('#__alert_sound').html(' '); 

else { 
jQuery('#__alert_sound').html('');