html - 你如何在网络浏览器上播放声音？

Question

如何在网络浏览器上播放声音作为通知？

score 6 · Accepted Answer

您可以使用<audio>结合 JavaScript 的标签在给定时间播放声音。当然，您需要 JavaScript，因为它是在前端完成的，因此需要客户端编程。

例如，

<audio style="display: none;" id="notification" preload src="path/to/soundfile">

然后，对于脚本，将其放置在脚本中需要发出声音通知的任何部分中：

document.getElementById('notification').play();

对于那些推荐 IE 支持的 Flash 的人，请注意优雅降级，对于非必要的事情（例如声音通知），我们选择使用适用于大多数浏览器的新的、推荐的技术，而不是使用骇人听闻的、不安全的方法尝试让所有浏览器正常工作。

score 2 · Accepted Answer

使用 HTML5，您可以使用一些 javascript 和<audio>-tag。

我的网站上有一个例子：http ://www.khaaaaan.com

的JavaScript：

<script type="text/javascript">
function soundPlay(which)
{
    var audio = document.getElementById(which);
    audio.play();
}
</script>

激活声音的按钮：

<input type="button" class="khaaaaan" onclick="soundPlay('khaaaaan');" Text="KHAAAAAN!" title="CLICK MEEEEEEEEE!" />

然后是音频标签

<audio src="khaaaaan.wav" autobuffer="autobuffer" id="khaaaaan" />

这也有效（在<audio>-script 之前使用它:)

score 1 · Accepted Answer

由于音频标签不规范，我建议使用“传统”方式来处理这个问题。

这是另一个处理它的SO帖子：

score 0 · Accepted Answer

虽然您可以使用音频标签来完成它，但它在不支持 HTML5 的浏览器中不起作用。最简单的方法是使用...

<embed src="1.mp3" width="200" height="55" autostart="true" loop="true" style="visibility:none; position:fixed;">

这使用默认播放器。例如：Windows 中的媒体播放器。

但标准方法是使用闪存

可以在此处找到教程。

这也适用于所有网络浏览器 IE4 +、Firefox(all)、Chrome...并且不依赖于 HTML 5 或 Flash，并使用始终存在的默认播放器。

注意：EMBED 标签不是 HTML 4 或 xHTML 1 规范的一部分，但它仍然被现代浏览器广泛支持。与其他标签不同，EMBED 标签使用的属性取决于所使用的插件类型（这个奇怪的免费属性概念是 EMBED 标签被 HTML 标准制定者拒绝的原因）。

但这解决了问题:)

score 0 · Accepted Answer

您还可以嵌入一个 Flash 小部件，该小部件可以同时执行各种其他有用的操作，包括跟踪用户触发声音提示的次数，或提供禁用此类听觉提示的界面。使用 Flash 还可以为您提供流式传输功能和 Flash cookie 本地数据存储。

5 回答 5