javascript - 从我的播放列表中随机播放音乐 onclick 图片

Question

我有这样的代码，当我单击图像时，可以播放一首音乐(声音在下面的代码上不起作用，但在我的网站上可以)，并在我再次单击它时暂停音乐。

我的疑问是，每次有人进入我的网站并单击图像时，如何从我的 var Sounds 播放列表中加载随机音乐？

提前致谢。

<script>
    var sounds = [
	"http://www.vtxfactory.com/sounds/royksopp.mp3",
	"http://www.vtxfactory.com/sounds/9thwonder.mp3",
	"http://www.vtxfactory.com/sounds/thisbeat.mp3",
	"http://www.vtxfactory.com/sounds/mosdef.mp3",
	"http://www.vtxfactory.com/sounds/oizo.mp3",
	"http://www.vtxfactory.com/sounds/dilla.mp3",];
	
	function StartOrStop(audioFile) {
        
		var audie = document.getElementById("myAudio");
        if (!audie.src || audie.src !== audioFile) audie.src = audioFile;
        console.log(audie.paused);
        if (audie.paused == false) {
            console.log('pause');
            audie.pause();
        } else {
            console.log('play');
            audie.play();
        }
    }
</script>

<img src="http://vtxfactory.com/images/vtxfactorylogobw.png" onclick="StartOrStop('http://www.vtxfactory.com/sounds/oizo.mp3')" class="spin" align="left" onmouseover="this.src='http://vtxfactory.com/images/vtxfactorylogocolor.png'" onmouseout="this.src='http://vtxfactory.com/images/vtxfactorylogobw.png'" onmousedown="this.src='http://vtxfactory.com/images/vtxfactorylogocolor.png'" onmouseup="this.src='http://vtxfactory.com/images/vtxfactorylogobw.png'" width="165px" height="190px" >
<audio id="myAudio"></audio>

Answer 1

这有效

<script>
    var sounds = [
        "http://www.vtxfactory.com/sounds/royksopp.mp3",
        "http://www.vtxfactory.com/sounds/9thwonder.mp3",
        "http://www.vtxfactory.com/sounds/thisbeat.mp3",
        "http://www.vtxfactory.com/sounds/mosdef.mp3",
        "http://www.vtxfactory.com/sounds/oizo.mp3",
        "http://www.vtxfactory.com/sounds/dilla.mp3"
    ];

    function StartOrStop(audioFile) {
        var audie = document.getElementById("myAudio");
        if (audie.paused) {
            audie.src = sounds[Math.floor(Math.random() * sounds.length)];
            audie.play();
        } else {
            audie.pause();
        }
    }
</script>

<img src="http://vtxfactory.com/images/vtxfactorylogobw.png" onclick="StartOrStop()" class="spin" align="left" onmouseover="this.src = 'http://vtxfactory.com/images/vtxfactorylogocolor.png'" onmouseout="this.src = 'http://vtxfactory.com/images/vtxfactorylogobw.png'" onmousedown="this.src = 'http://vtxfactory.com/images/vtxfactorylogocolor.png'" onmouseup="this.src = 'http://vtxfactory.com/images/vtxfactorylogobw.png'" width="165px" height="190px" >
<audio id="myAudio"></audio>