如何在网页上点击播放随机声音? [英] How can I play a random sound on click in a web page?

查看:83
本文介绍了如何在网页上点击播放随机声音?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我想要点击网页上的按钮播放随机声音。我已经研究了很多,这个讨论对我最有帮助: http://www.elated .com / forums / topic / 5196 /

建议让JavaScript函数在点击按钮时运行,如下所示:

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

** //在这里选择随机声音并播放它**
}
< / script>

我了解制作声音数组的部分。我想我有关于选择一个随机数组元素的部分。我只是停留在如何在海报推荐的JS函数内播放声音。我可以在JS函数中使用HTML5音频标签吗?



我不关心实际播放文件的代码是在函数内部还是外部。实际上,我首先要使用JS来随机选择一个元素,然后让一行HTML播放由JS函数返回的数组元素。我放弃了这一点,因为我无法弄清楚如何指定我想要在HTML中播放JS函数的返回值。



谢谢。

使用JavaScript添加声音



将以下脚本放在

中,

 < script language = code $< head>  javascripttype =text / javascript> 
函数playSound(soundfile){
document.getElementById(dummy)。innerHTML =
< embed src = \+ soundfile +\hidden = \ true \autostart = \true \loop = \false \/>;
}
< / script>

声音放置在一个空的范围内



<脚本启动时,JavaScript将一个嵌入标签放入一个空的span标签中。所以,你需要在你的HTML页面的正文中最好添加下面的span文件,最好靠近文档顶部:

 < span id =dummy>< / span> 

使用onmouseover或onclick属性调用脚本

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

 < a href =#onclick =playSound('URL to soundfile ');>点击此处收听声音< / a> 


I want a random sound to play on a click on a button on a web page. I have researched it quite a bit and this discussion has helped me most: http://www.elated.com/forums/topic/5196/

One poster recommended making a Javascript function to run whenever the button is clicked, as follows:

<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>

I understand the part about making an array of sounds. I think I have the part about selecting a random array element figured out. I am just stuck on how to play a sound inside the JS function as the poster recommends. Can I use an HTML5 audio tag inside the JS function?

I don't care whether the code for actually playing the file is inside or outside the function. Actually, I was first going to use JS just to randomly select an element, then have a line of HTML play the element of the array returned by the JS function. I gave up on that because I couldn't figure out how to specify that I wanted to play the return value of a JS function in HTML.

Thank you.

解决方案

Use JavaScript to Add Sound

Place the following script in the <head> of your HTML document:

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

The Sound is Placed in an Empty Span

The JavaScript places an embed tag inside an empty span tag when the script is initiated. So, you need to add the following span file somewhere within the body of your HTML page, preferabl near the top of the document:

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

Call the Script with an onmouseover or onclick Attribute

The last thing you need to add is an element that you want to generate the sound on click or on mouseover. Call the script with one of those attributes:

<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>

这篇关于如何在网页上点击播放随机声音?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆