美文网首页
audio标签在IE下的兼容问题

audio标签在IE下的兼容问题

作者: 出门晒太阳 | 来源:发表于2018-01-09 13:53 被阅读0次

刚处理一个bug,IE下audio标签不能播放音频,谷歌和火狐可以,音频的src是ajax请求数据后动态设置的,是存在网上的资源,如http://p2.music.126.net/vDBVFyat4CJcSXI_6-jzbA==/2092370627667073.mp3


1、在谷歌火狐可以,IE下不行,代码如下:

html:  <audio id='audio'    src='a.mp3'   >请升级浏览器<.audio>

js:$("#audio").attr('src',imgSrc); (imgSrc是请求来的路径变量)

这时候,audio的监听错误事件打印errorCode为4,url无效

2、修改代码,IE下可以正常播放

html: 

<audio id='audio'  >请升级浏览器<source type='audio/megg' src='a.mp3' /></audio>

js:

let audioSource = $('#audio source').get(0);

audioSource.type='audio/mpeg';

audioSource.src=imgSrc;

注意:HTML里source的type是写错的,js里再设置为正确的;

此时IE11可以正常播放,但是谷歌和火狐又不行了;

3、IE和谷歌火狐都可以:

html: 

<audio id='audio' >请升级浏览器<source type='audio/megg' src='a.mp3' /></audio>

js:

let audioSource = $('#audio source').get(0);

audioSource.type='audio/mpeg';

audioSource.src=imgSrc;

$("#audio").attr('src',imgSrc);

我的文件都是mp3,所以type是mpeg

简书这个编辑器真难用。

相关文章

网友评论

      本文标题:audio标签在IE下的兼容问题

      本文链接:https://www.haomeiwen.com/subject/vepwnxtx.html