I have a function that displays a random word from an array of objects, in a non-repeated way.
My goal is to make it play a sound clip with each word (that sound would be the word's pronounciation).
But, for some reason, I don't get any sound, in any browser, nor do any error messages show up. What can the cause be?
This is what I am working with:
const p = document.getElementById("randomWord");
const myWords = [
{
text: "alpha",
audio: "alpha.mp3"
},
{
text: "bravo",
audio: "bravo.mp3"
},
{
text: "charlie",
audio: "charlie.mp3"
},
{
text: "delta",
audio: "delta.mp3"
},
{
text: "echo",
audio: "echo.mp3"
}
];
let remainingWords = [];
function randomize() {
if (remainingWords.length === 0) remainingWords = myWords.slice();
let length = remainingWords.length;
let randomIndex = Math.floor(Math.random() * length);
const word = remainingWords[randomIndex];
remainingWords.splice(randomIndex, 1);
console.log(word);
console.dir(p);
p.textContent = word.text;
document.getElementById("soundClip").play(word.audio);
}
<audio id="soundClip">Your browser does not support the audio element.</audio>
<button onclick="randomize()" type="button">Random Word</button>
<p id="randomWord"></p>
Aucun commentaire:
Enregistrer un commentaire