簡體   English   中英

單鍵播放隨機聲音

[英]Play a random sound on single button

首先,我首先要說我是您遇到過的最糟糕的編碼器。 我正在嘗試制作一個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>

您可以按照以下鏈接使用play()方法。 W3學校

而且我認為最好使用Math.random()方法。 像在下面的代碼中一樣,您可以定義最大值和最小值。

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

在您的情況下,最小值為0,最大值為數組中最后一項的索引。 這應該做。

而且,如果您直接更改數組項,則指向聲音的鏈接甚至會更短。

您需要添加音頻標簽。 這僅在瀏覽器支持HTML 5時有效

您可以在此處了解有關音頻標簽的更多信息: http : //www.w3schools.com/html/html5_audio.asp以及音頻DOM參考位於此處: http : //www.w3schools.com/tags/ref_av_dom.asp

通過這些鏈接,您可以輕松實現所需的操作。

並檢查這些答案,以了解如何更改音頻源

用javascript更改<audio> src

您正確使用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">

然后選擇元素並播放聲音

Java腳本

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();
}

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM