在单个按钮上播放随机声音

首先，我将首先说我是你遇到过的最差的编码器。我正在尝试制作一个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>

来源

2016-09-20 Jacob Ridge

您需要添加音频标签。这只能如果浏览器支持HTML 5

你可以阅读更多关于音频标签浏览： http://www.w3schools.com/html/html5_audio.asp 而在这里的音频DOM参考： http://www.w3schools.com/tags/ref_av_dom.asp

有了这些你可以很容易达到什么样的链接你想要做的。

并检查你怎么可以改变音频源

change <audio> src with javascript

来源

2016-09-20 22:13:46 manuerumx

您可以使用方法发挥（）如下面的链接，这些答案。 W3 Schools

而且我认为如果使用Math.random（）方法会更好。如在后续代码中，您可以定义最大值和最小值。

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

你的情况分钟数是0，最大值是最后一个项目的数组中的索引。这应该做到这一点。

如果你直接改变你的数组项目的链接声音你的代码甚至会更短。

来源

2016-09-20 22:16:41

这将只适用于如果你的每个声音的音频元素。你必须选择这些元素才能调用'play（）' – Literphor

您正确使用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(); 
}

来源

2016-09-20 22:19:34 Literphor

保持javascript数组中的声音链接不是更好吗？根据您的代码，如果有200种声音可供选择，页面会变慢。随着元素数量的增加，浏览器将开始反应更慢。 –

如果他创建了许多音频元素，它会变慢，因为在加载页面之后每个声音都必须立即下载到浏览器，所以是的，这里有一个潜在的瓶颈，但是您可以向用户展示加载屏幕并让他们等待为一切下载。 – Literphor

jQuery一旦被告知播放它就会下载声音，但是另一个潜在的瓶颈在于文件大小和用户的Internet连接。我会选择立即加载所有的声音，以便他们可以在点击按钮时立即播放 – Literphor

在单个按钮上播放随机声音

回答

相关问题