html - 随机选择音频文件(onclick效果)

标签 html audio random onclick click-counting

我成功地向clickcounter图片添加了onclick音频效果,但是我想知道,有什么方法可以随机选择一种声音,而不是一种声音吗?当我单击图像时,出现单击图像的次数,并播放声音,但是我希望它在每次单击时播放一个不同的(随机)音频文件(从我的选择中)

这些是到目前为止我的按钮脚本

Javascript

function clickCounter(){
     var audio = document.getElementById("audio");
     audio.play();
     if(typeof(Storage)!=="undefined"){
         if (localStorage.clickcount)
         {
             localStorage.clickcount=Number(localStorage.clickcount)+1;
         }
         else
         {
             localStorage.clickcount=1;
         }
         document.getElementById("result").innerHTML="<center><b>You have clicked the poop
         </b>"+ localStorage.clickcount + "<b> times!</b></center>";
     }
     else{
         document.getElementById("result").innerHTML="I'm sorry to inform you that your browser
         does not support this web storage... I guess you could say that your browser is...
         shit! awwww yeaahh!";
     }
     cursor: pointer;
}

HTML
<center>
     <font face="chiller" color="#603913" "font size="300" <align="center"><b>Click the
     poop!</b>
</center>
<center>
    <p><picture onclick="clickCounter()"><picture
     onmouseover="document.getElementById('touch').play()"><img src="poop.png"></button></p>
</center>
<audio id="audio" src="fart-01.wav"></audio>
<audio id="touch" src="sticky goo.wav"></audio>
<div id="result"></div>

我该如何编写脚本?我知道我必须将其与当前的onclick函数交织在一起,并且还必须创建一个表,也许带有tr或td标签。有人可以帮我吗?我不能使它工作。

预先感谢所有人!

最佳答案

您可以为此使用一个开关盒。

您生成一个随机数,例如

var number = Math.floor((Math.random() * 3) + 1);

那么您可以使用切换盒从随机数产生的N种可能性中选择一种随机声音。

喜欢

函数setSound(){
    switch (number) {
    case 1:
        setSound1;
        return sound;
        break
    case 2:
         setSound2;
        return sound;
        break
    case 3:
         setSound3;
        return sound;
        break
    }
}

然后将返回值添加到您想要播放声音的代码中。

在这种情况下,您需要返回从swtich情况中随机选择的声音文件的名称。

关于html - 随机选择音频文件(onclick效果),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26157147/

相关文章:

php - 如何在PHP中将两个音频文件与一个作为背景音乐结合在一起?

java - 使用 Java 的视频/语音聊天 Web 应用程序

caching - 具有范围请求插件 : cannot fetch mp3 files when offline 的服务 worker

php - 如何从 2 个不同的数字范围中选择 1 个随机数?

html - div 的位置与图像固定在 div 下,主要内容

html - 使用 Template Toolkit 在不使用多个循环的情况下勾选复选框

jquery - 触发鼠标进入随机元素

javascript - 不知道如何让这个名称生成器工作

html - 如何防止 headline 和 span 元素之间的换行符?

jquery - 使用 jQuery 选择器根据值或状态获取表单元素