如何在一个网页上播放多个声音文件？(点击最佳做法)

Question

我有一个页面,其中有一个词汇表列表.每个词汇都有一个TTS.我目前使用的方法是为每个词汇包括一个mp3 flash播放器.这会导致加载所有闪存的延迟,因为一个页面中可能有超过10个词汇表.

另一个问题是必须在页面加载时创建tts文件的mp3,这也会延迟加载时间.

在我看来,一些替代方法是:

• 仅包含一个Flash播放器.
• 单击加载和播放文件以减少tts文件创建的页面加载.

所以我的问题是,

是否有任何javascript或jquery插件可以执行其他两种方法之一？

谢谢

Answer 1

您可以使用<audio>标签（HTML5），并且可以控制何时加载文件。
大多数浏览器都支持它，例如 Google Chrome、Firefox、Opera...

设置链接有两种方法：

方式一

<audio src="YOUR FILE LINK HERE">
    <embed> <!--FALLBACK HERE (FLASH PLAYER FOR IE)--> </embed>
</audio>

方式2

<audio>
    <source src="YOUR FILE LINK HERE (MP3)" type="audio/ogg" />
    <source src="YOUR OTHER FILE LINK HERE (OGG)" type="audio/mp3" />
    <embed> <!--FALLBACK HERE (FLASH PLAYER FOR IE)--> </embed>
</audio>

属性

• controls="controls"如果您希望它显示音频播放器，请放置。
• loop="loop"如果您希望它循环播放音频，请放置。
• autoplay="autoplay"如果您希望它自己播放音频，请放置。
• preload="preload"如果您想要预加载它，请放置它。

JavaScript 控制

您还可以使用 JavaScript 来控制它。

播放： 暂停：document.getElementById("YOUR AUDIO TAG").play()
document.getElementById("YOUR AUDIO TAG").pause()

阅读更多

• http://w3schools.com/html5/tag_audio.asp