1

我希望在单击网页上的按钮时播放随机声音。我已经研究了很多，这个讨论对我帮助最大：http ://www.elated.com/forums/topic/5196/

一位发帖人建议在单击按钮时运行 Javascript 函数，如下所示：

<script>
function playSound() {
  var sounds = [
    "http://www.mysite.com/1.wav",
    "http://www.mysite.com/2.wav",
    "http://www.mysite.com/3.wav"
  ];

  **// Choose a random sound here and play it**
}
</script>

我了解制作一系列声音的部分。我想我已经弄清楚了选择随机数组元素的部分。我只是坚持如何按照海报的建议在 JS 函数中播放声音。我可以在 JS 函数中使用 HTML5 音频标签吗？

我不在乎实际播放文件的代码是在函数内部还是外部。其实我是先用JS随便选一个元素，然后让一行HTML播放JS函数返回的数组的元素。我放弃了，因为我不知道如何指定我想在 HTML 中播放 JS 函数的返回值。

谢谢你。

4

3 回答 3

2

使用 JavaScript 添加声音

将以下脚本放在<head>您的 HTML 文档中：

<script language="javascript" type="text/javascript">
 function playSound(soundfile) {
 document.getElementById("dummy").innerHTML=
 "<embed src=\""+soundfile+"\" hidden=\"true\" autostart=\"true\" loop=\"false\" />";
 }
 </script>

声音被放置在一个空的 Span 中

当脚本启动时，JavaScript 会在一个空的 span 标签内放置一个 embed 标签。因此，您需要在 HTML 页面正文中的某处添加以下 span 文件，最好靠近文档顶部：

<span id="dummy"></span>

使用 onmouseover 或 onclick 属性调用脚本

您需要添加的最后一件事是您希望在单击或鼠标悬停时生成声音的元素。使用这些属性之一调用脚本：

<a href="#" onclick="playSound('URL to soundfile');">Click here to hear a sound</a>

 <p onmouseover="playSound('URL to soundfile');">Mouse over this text to hear a sound</p>
于 2012-06-14T19:30:02.090 回答
1

如果你有你的音频元素的 ID，你可以这样做：

document.getElementById(theId).play();

音频元素可能如下所示：

<audio id="someId">
    <source src=sound/zbluejay.wav>
</audio>

如果你需要它，你可以像这样动态添加音频元素：

document.write("<audio id=someId><source src=yourURL</audio>");
document.getElementById('someId').play();​​​​

在这里拉小提琴。

于 2012-06-14T19:28:06.443 回答
1

没有测试过这个，但我想它应该可以工作。我基本上从数组中选择一个随机字符串，然后将一个嵌入元素放入 div 中，其 id 为“元素”，然后启动声音。

<script>
function playSound() {
  var sounds = new Array(
    "http://www.mysite.com/1.wav",
    "http://www.mysite.com/2.wav",
    "http://www.mysite.com/3.wav"
  );

$.("#element").html("<embed src=\""+Math.floor(Math.random()*(sounds.length+1))+"\" autostart=\"true\" />");

}
</script>

编辑：我测试了这个：

<html>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js"></script>
<script>
function playSound() {
  var sounds = new Array(
    "file:///X:/test.mp3"
  );

$("#element").html("<embed src=\""+sounds[Math.floor(Math.random()*(sounds.length+1))]+"\" hidden=\"true\" autostart=\"true\" />");
}
</script>
</head>
<body onload="javascript:playSound()">

<div id="element">
</div>
</body>

</html>
于 2012-06-14T19:32:45.907 回答