Question

音频播放器加载并初始化，但是一旦我通过第三首歌曲，控件就会消失（参见>= 3测试）。我不确定这是否是一个令人难以置信的巧合，但似乎我可能已经破坏了一些东西。为什么音频控件会消失？

此外，音量控件不会初始化。有谁知道为什么？

<script>
window.onload = function() {
    var number = Math.floor((Math.random() * 10) + 1);
    if(number >= 3) {
        document.getElementById("audio").innerHTML = "<audio id='vid' src='remix.mp3' type='audio/mpeg' autoplay='true' loop='true'></audio>";
    } else {
        document.getElementById("audio").innerHTML = "<audio id='vid' src='lose.mp3' type='audio/mpeg' autoplay='true' loop='true'></audio>";
    }
};
(function(){
    var vid = document.getElementById("vid");
    vid.volume = 0.2;
    });
</script>
<script>
jQuery(function($) {
    $("#vid").prop('volume', 0.2);
    window.setVolume = function(bgAudio,vol) {
        sounds[bgAudio].volume = 0.33;
    }
});
</script>
<div id="audio">

</div>

Answer 1

无需替换整个audio标记。只需更改src属性：

<audio id='vid' src='remix.mp3' type='audio/mpeg' autoplay='true' loop='true'></audio>

...

$('#vid').attr('src', 'remix.mp3');

修改

你的代码很乱，我试着稍微重构一下：

(function() { var number = Math.floor((Math.random() * 10) + 1); var player = $('#vid'); player.attr('src', number >= 3 ? 'remix.mp3' : 'lose.mp3'); player.prop('volume', '0.2'); player[0].play(); //run the audio track //not sure about this function window.setVolume = function(bgAudio, vol) { sounds[bgAudio].volume = vol; } });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.1/jquery.min.js"></script> <audio id='vid' src='' type='audio/mpeg' loop='true'></audio>

并检查mp3文件名和位置。

JS和JQuery音频卷不初始化

1 个答案: