HTML5 IE9+ audio标签播放声音

时间:2021-05-05 09:24:52

IE8或者以下的浏览器可以使用bgsound标签或者img标签播放声音文件(IE独有),但是这两标签的属性和事件,你说你除了播放声音能用来干嘛、、

关于HTML 5音频标签,官方文档有使用说明http://www.w3school.com.cn/html5/html_5_audio.asp

我们一起来看下现在主流浏览器对html5音频格式的支持http://www.cnblogs.com/lhb25/archive/2011/05/26/1997341.html


HTML5 IE9+ audio标签播放声音

ACC编码格式来存储音乐似乎越来越少,尽管比几乎所有的传统编码方式在同规格的情况下更胜一筹,这里不看它。

人感觉IE一直以来都挺奇葩,确实很有个性,其他主流浏览器支持的wav编码格式它果断无视。但是我们也没办法,用它的人太多了,随着win7系统的潮流,使用IE9的用户也会越来越多,所以还是得让着他。另外说一句现在版本的firefox 2.4也支持mp3编码格式的音频文件了。

我使用这个标签只要是鉴于其事件,需求是按顺序播放一个声音序文件序列,html5媒体标签onended事件(当媒介已抵达结尾时运行脚本)可以很容易做到;编码的事情没花多久,测试的时候,在chorm,firefox,360上都没有啥问题,但是到了IE上就莫名其妙没声音,声音文件没有播放,onended事件肯定不会触发。比较官方文档上的例子也没发现什么不同,然后我把测试音频文件换成文档上的url,声音又神奇的出现了,事件触发也完全没问题。在其他浏览器运行正常说明音频文件没问题,然而google服务器上的文件可用而本地服务器上的音频文件不可用,问题就可能是出现在本地服务器上。在网上找了下资料发现是tomcat上扩展名MP3配置有问题,找到conf下面的web.xml文件

原配置:

<mime-mapping>
<extension>mp3</extension>
<mime-type>audio/x-mpeg</mime-type>
</mime-mapping>
修改成:
<mime-mapping>
<extension>mp3</extension>
<mime-type>audio/mp3</mime-type>
</mime-mapping>
这样就可以在IE上正常运行本地服务器上的音频文件了(其他浏览器也支持)。

希望IE浏览器能对HTML5和CSS3有更好的支持,帮我们省点事。