1

我正在尝试为“listOfWords”中的每个单词分配不同的声音,我不知道从这里开始随机打印其中一个单词并播放声音剪辑。

var listOfWords = {
    "mat": "http://www.wav-sounds.com/cartoon/daffyduck1.wav",
    "cat": "http://www.wav-sounds.com/cartoon/hankhill1.wav",
    "dog": "http://www.wav-sounds.com/cartoon/bugsbunny1.wav",
    "pit": "http://www.wav-sounds.com/cartoon/familyguy2.wav",
    "pot": "http://www.wav-sounds.com/cartoon/porkypig1.wav"
}​

在这里,我有到目前为止我尝试过的随机生成..

var shuffledWords = listOfWords.slice(0).sort(function() {
return 0.5 - Math.random();
}).slice(0, 1);
4

4 回答 4

1

slice并且sort是数组的方法。你所拥有的是一个object.

如果要获取该对象的随机属性,则必须使用循环:

var listOfWords = {
    "mat": "http://www.wav-sounds.com/cartoon/daffyduck1.wav",
    "cat": "http://www.wav-sounds.com/cartoon/hankhill1.wav",
    "dog": "http://www.wav-sounds.com/cartoon/bugsbunny1.wav",
    "pit": "http://www.wav-sounds.com/cartoon/familyguy2.wav",
    "pot": "http://www.wav-sounds.com/cartoon/porkypig1.wav"
};

var randomInt = Math.floor(Math.random() * (listOfWords.length + 1));
var chosenSound;

for (var prop in listOfWords) {
    if (randomInt === 0) {
        chosenSound = listOfWords[prop];
        break;
    }

    randomInt--;
}

请注意,迭代对象时并不总是保证顺序,但无论如何您都是随机选择的,所以这并不重要。

于 2012-07-23T15:20:25.250 回答
1

解决并完美地使用您想要的每个单词的声音。

看一看:

http://jsfiddle.net/oscarj24/7kbNe/

于 2012-07-23T15:27:56.757 回答
1

我想你已经明白每个人都说什么了。对象不能使用数组中的方法,因此您需要另一种方法来随机它们的属性。在从 Javascript 对象中选择随机属性上找到一个

然后,选择一个随机键及其值。打印密钥,播放声音。

// function to pick random property from object 
// from https://stackoverflow.com/questions/2532218/pick-random-property-from-a-javascript-object
function pickRandomProperty(obj) {
    var keys = [];
    for (var prop in obj) {
        if (obj.hasOwnProperty(prop)) {
            keys.push(prop);
        }
    }
    return keys[Math.floor(keys.length * Math.random())];
}

var listOfWords = {
    "mat": "http://www.wav-sounds.com/cartoon/daffyduck1.wav",
    "cat": "http://www.wav-sounds.com/cartoon/hankhill1.wav",
    "dog": "http://www.wav-sounds.com/cartoon/bugsbunny1.wav",
    "pit": "http://www.wav-sounds.com/cartoon/familyguy2.wav",
    "pot": "http://www.wav-sounds.com/cartoon/porkypig1.wav"
};

var shuffledWords = pickRandomProperty(listOfWords), 
    shuffledSound = new Audio(listOfWords[shuffledWords]);

// "write" the word (ugly way)
document.write(shuffledWords);
// play the sound
shuffledSound.play();
于 2012-07-23T15:32:05.547 回答
0

这是一个 HTML5 解决方案。据说IE9不能播放wav文件。此外,来自 wav-sounds.com 的一些 wav 文件会引发解码错误(在 FF14 中),因为示例我使用了不同的声音 url。为了简化随机选择,这将 listOfWords 声明为数组数组。希望能帮助到你。

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <script type="text/javascript">

        var listOfWords = [
            ["mat","http://www.wav-sounds.com/various/applause.wav"],
            ["cat", "http://www.wav-sounds.com/various/bomb.wav"],
            ["dog", "http://www.wav-sounds.com/various/bark.wav"],
            ["pit", "http://www.wav-sounds.com/various/beep.wav"],
            ["pot", "http://www.wav-sounds.com/various/cashtill.wav"]
         ];

        function playRandom() {
            var wordWavUrl = listOfWords[Math.floor(listOfWords.length * Math.random())];
            var word = wordWavUrl[0];
            var url = wordWavUrl[1];
            document.getElementById("wordDisplay").innerHTML=word;
            document.getElementById("audioPlay").src=url;
            document.getElementById("audioPlay").autoplay="autoplay";
        }
    </script>
</head>
<body>
    <div id="wordDisplay"></div>
    <button onclick="playRandom();">play random</button>
    <audio id="audioPlay">
    </audio>
</body>
</html>
于 2012-07-23T16:18:41.157 回答