嵌入的音频在 Safari/iOS 上不可见

Posted 2023-02-25

【中文标题】嵌入的音频在 Safari/iOS 上不可见

【英文标题】：Embedded audio not visible on Safari/iOS

【发布时间】：2020-11-24 09:44:00

【问题描述】：

我有这个嵌入的音频，在 Chrome、Firefox 或 IE 中它会加载并按原样显示，但是当我在 Safari 或 ios 中打开它时它不可见。它在那里，因为它仍然占用页面上的空间，但它只是没有显示。奇怪的是，如果我检查元素并说，删除单词音频，然后重新添加单词音频，然后播放器会显示在页面上。

为什么它不能立即加载？

<audio controls>
   <source src="https://assets.ctfassets.net/y4nxuejkhx03/1Emfg6tpZsyRiipdrUAXTk/6814cbae4dccff5db7a2454fe2c10997/09142020_Marco-Willner-FINAL_EP_-_14-09-2020_14.43.mp3" type="audio/mpeg">
</audio>

【参考方案1】：

这可能是兼容性问题..

试试这个代码：

<audio controls>
<source src="audio.mp3" type="audio/mpeg">
<p>Your browser does not support this audio file</p>
</audio>

如果在页面中看到Your browser does not support this audio file这一行，则浏览器不支持audio标签。

如果您没有看到该句子或嵌入的音频，请尝试将代码更改为这种格式：

<audio src="audio.mp3" controls></audio>

请注意，音频标签仅适用于 Safari 4.0 及更高版本

【讨论】：

感谢您的回复。不幸的是，它没有帮助。您是否认为它确实显示但最初不想显示它是兼容性？它显示的唯一方法仍然是在开发工具中将其删除，然后重新添加它就可以了。真的不知道为什么。我已经尝试过预加载属性也无济于事。

@hal_jordan27 你是直接使用音频代码还是使用任何javascript来播放音频？