Javascript按鈕播放隨機聲音

Question

所以我是新來的，需要一些（也許很多）的幫助。我希望能夠按下一個按鈕並從中隨機播放聲音。我認爲我到目前爲止所做的是正確的，但我真的不知道如何使它工作。

這裏是我的JavaScript

function mySounds() 
    { 
    var x = Math.floor((Math.random() * 10) + 1); 
    var sound = ["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; 

if (x === sound1){ 
    function sound1play(){ 
    var sound1 = new Audio(); 
    sound1.src = "Pokemon.mp3"; 
    sound1.play(); 
    } 
} 
if (x === sound2){ 
    function sound2play() { 
    var sound2 = new Audio(); 
    sound2.src = "Wonderwall.mp3"; 
    sound2.play(); 
    } 
    } 
if (x === sound3){ 
    function sound3play() { 
    var sound3 = new Audio(); 
    sound3.src = "Tacobell.mp3"; 
    sound3.play(); 
    } 
    } 
if (x === sound4){ 
    function sound4play() { 
    var sound4 = new Audio(); 
    sound4.src = "Starwars.mp3"; 
    sound4.play(); 
    } 
    } 
if (x === sound5){ 
    function sound5play() { 
    var sound5 = new Audio(); 
    sound5.src = "Mcdonalds.mp3"; 
    sound5.play(); 
    } 
    } 
if (x === sound6){ 
    function sound6play() { 
    var sound6 = new Audio(); 
    sound6.src = "KFC.mp3"; 
    sound6.play(); 
    } 
    } 
if (x === sound7){ 
    function sound7play() { 
    var sound7 = new Audio(); 
    sound7.src = "Salvia.mp3"; 
    sound7.play(); 
    } 
    } 
if (x === sound8){ 
    function sound8play() { 
    var sound8 = new Audio(); 
    sound8.src = "Allstar.mp3"; 
    sound8.play(); 
    } 
    } 
if (x === sound9){ 
    function sound9play() { 
    var sound9 = new Audio(); 
    sound9.src = "Funtime.mp3"; 
    sound9.play(); 
    } 
    } 
if (x === sound10){ 
    function sound10play() { 
    var sound10 = new Audio(); 
    sound10.src = "Clothes.mp3"; 
    sound10.play(); 
    } 
    } 
document.getElementById('soundbutton').addEventListener('click', soundplay); 

這裏是我的HTML

<a href="#" id="soundbutton">Press</a> 
<script type="text/javascript" src="popup.js"></script> 

Answer 1

試試這個

function mySounds() { 
    var x = Math.floor((Math.random() * 10) + 1); 
    var sound = new Audio(); 
    switch (x) { 
    case 1: 
     sound.src = "Pokemon.mp3"; 
     break; 
    case 2: 
     sound.src = "Wonderwall.mp3"; 
     break; 
    case 3: 
     sound.src = "Tacobell.mp3"; 
     break; 
    case 4: 
     sound.src = "Starwars.mp3"; 
     break; 
    case 5: 
     sound.src = "Mcdonalds.mp3"; 
     break; 
    case 6: 
     sound.src = "KFC.mp3"; 
     break; 
    case 7: 
     sound.src = "Salvia.mp3"; 
     break; 
    case 8: 
     sound.src = "Allstar.mp3"; 
     break; 
    case 9: 
     sound.src = "Funtime.mp3"; 
     break; 
    case 10: 
     sound.src = "Clothes.mp3"; 
     break; 
    } 
    sound.play(); 
} 

document.getElementById('soundbutton').addEventListener('click', mySounds); 

希望這有助於你。

Answer 2

下面是我建議的做法。沒有必要使用數組來獲取歌曲，您正在不必要地編寫額外的代碼。

//declare a sound variable 
 
var sound; 
 

 
//function to generate a random number 
 
function generateRandomNumber() { 
 
    return Math.floor((Math.random() * 2) + 1); 
 
} 
 

 
function playSound(){ 
 
    //assign random number to x 
 
    var x = generateRandomNumber(); 
 

 
    //if the sound exists pause, otherwise 
 
    //create a new instance of the sound object 
 
    if (sound) { 
 
     sound.pause(); 
 
    } else { 
 
     sound = new Audio(); 
 
    } 
 

 
    if(x == 1) { 
 
     sound.src = "http://www.stephaniequinn.com/Music/Allegro%20from%20Duet%20in%20C%20Major.mp3"; 
 
    } else if(x == 2) { 
 
     sound.src = "http://www.stephaniequinn.com/Music/The%20Entertainer.mp3"; 
 
    } 
 
    //play sound 
 
    sound.play(); 
 
} 
 

 
document.getElementById('soundbutton').addEventListener('click', playSound);

<a href="#" id="soundbutton">Press</a>

Answer 3

你並不真的需要一個開關都沒有。只需獲得0到您擁有的聲音文件數之間的隨機數，然後將其用作這些聲音文件數組的索引。

var sounds = [ 
    "Pokemon.mp3", 
    "Wonderwall.mp3", 
    "Tacobell.mp3", 
    "Starwars.mp3", 
    "Mcdonalds.mp3", 
    "KFC.mp3", 
    "Salvia.mp3", 
    "Allstar.mp3", 
    "Funtime.mp3", 
    "Clothes.mp3" 
]; 

var sound; 

//function used to create a random number 
function generateRandomNumber(max) { 
    return Math.floor(Math.random() * max); 
} 

function playSound() { 
    //create a random number and assign to x 
    var x = generateRandomNumber(sounds.length - 1); 
    var soundSrc = sounds[x]; 
    //create a new instance of the audio object 
    if (sound) { 
     sound.pause(); 
    } else { 
     sound = new Audio(); 
    } 
    sound.src = soundSrc; 
    //play the sound 
    sound.play(); 
} 

document.getElementById('soundbutton').addEventListener('click', playSound); 

<a href="#" id="soundbutton">Press</a>