IE9多个<audio>标签阻止进一步的HTTP请求</audio>

Question

我有一个包含多个标签的网页，例如：

<audio controls="controls" preload="metadata">
    <source type="audio/mpeg" src="file1.mp3"></source>
</audio>

每个标签播放不同的文件，每个mp3文件相当长（即完全下载需要一分钟）。

如果我有超过4个标签，IE9中只会显示前4个标签。每当前4个音频播放器中的一个完成加载其音频文件时，将逐个显示其他的。

实际上，在其中一个音频播放器停止加载之前，单击页面中的任何超链接都不会加载相应的HTTP资源。似乎音频标签对同时HTTP连接的数量设置了硬限制。 IE9通常有更高的限制，所以这看起来很奇怪。

其他注意事项：

• 音频文件加载并自行播放

  • 我不需要同时播放文件，我只想拥有一个显示不同文件的多个音频播放器的页面

  • 我尝试使用不同的值（none | metadata | auto）作为preload属性。 'none'完全隐藏了IE9中的音频播放器， 和元数据和自动显示相同的问题。

  • this answer提到IE9中最多有40名玩家应该没问题，但是我不能超越4？

感谢任何想法，谢谢。

Answer 1

当音频标签的 preload 属性设置为“元数据”时，IE9确实存在一些故障。

更具响应性的行为的可能解决方法是：

1. 设置preload = "none"

2. 用带有背景图片的图片或div包装<audio>标签

3. 将“点击”事件附加到将触发的图片/ div：document.getElementById('audio1').play()

希望它符合您的需求。