在单个按钮

时间:2016-09-20 22:00:45

标签: javascript html

首先,我将首先说我是你遇到过的最糟糕的编码员。我尝试制作一个Javascript,允许我按下一个按钮并进行随机声音播放。我的想法是随机做一个数学,并让一个数字与一个声音对应,然后发出一个if语句。我真的不知道从哪里开始。我实际上不知道我是否能做到这一点。

我的Javascript

function myFunction() {
var x = Math.floor((Math.random() * 10) + 1);
var sounds = ["sound1", "sound2", "sound3", "sound4", "sound5", "sound6", "sound7", "sound8", "sound9", "sound10"];
sound1 = 1;
sound2 = 2;
sound3 = 3;
sound4 = 4;
sound5 = 5;
sound6 = 6;
sound7 = 7;
sound8 = 8;
sound9 = 9;
sound10 = 10;
sound1.src = "sound1.mp3";
//And so on of the sound files

}

我的HTML

<button onclick="mySounds()">Click for a sound</button>
<p id="Sounds"></p>

3 个答案:

答案 0 :(得分:1)

您可以使用方法play(),如以下链接所示。 W3 Schools

如果你使用Math.random()方法,我觉得它会更好。与后续代码一样,您可以定义最大值和最小值。

function getRandomArbitrary(min, max) {
    return Math.random() * (max - min) + min;
}

您的案例中的最小数字将为0,而max将是数组中最后一项的索引。这应该做到。

如果您直接更改数组项目,那么您的代码甚至会更短的链接。

答案 1 :(得分:0)

您需要添加音频标签。 这仅适用于浏览器支持HTML 5

的情况

您可以在此处详细了解音频标签: http://www.w3schools.com/html/html5_audio.asp 这里的Audio DOM参考: http://www.w3schools.com/tags/ref_av_dom.asp

通过这些链接,您可以轻松实现您想要的目标。

并查看这些答案,了解如何更改音频源

change <audio> src with javascript

答案 2 :(得分:0)

您可以使用Math.random来随机选择要播放的声音。您所要做的就是将生成的数字映射到声音数组中的索引。

然后,您可以使用jQuery发出您想要听到的声音:https://github.com/admsev/jquery-play-sound

mySounds = [ 'sound1', 'sound2', 'sound3', 'sound4', 'sound5' ]
function randomSound() {
    var index = Math.floor(Math.random() * 1000) % mySounds.length;
    $.playSound('http://yourdomain.com/sounds/' + mySounds[index]);
}

我乘以1000,因为最好使用更大范围的值。 mod确保我们总能得到一个符合你声音数量的值。

如果你不想使用jQuery,你必须为你想要的每个声音创建音频标签并明确地调用它们

<强> HTML

<audio id="sound1" src="sounds/sound1" type="audio/wav">
<audio id="sound2" src="sounds/sound2" type="audio/wav">
<audio id="sound3" src="sounds/sound3" type="audio/wav">
<audio id="sound4" src="sounds/sound4" type="audio/wav">
<audio id="sound5" src="sounds/sound5" type="audio/wav">

然后选择元素并播放声音

<强>的Javascript

mySounds = [ 'sound1', 'sound2', 'sound3', 'sound4', 'sound5' ]
function randomSound() {
    var index = Math.floor(Math.random() * 1000) % mySounds.length;
    var id = mySounds[index];
    var audioElement = document.getElementById(id);
    audioElement.play();
}