切換SHOUTcast音頻流HTML5音頻播放器和JQuery

Question

您好，我將在下面粘貼evrything，但是發生的是它正在使用正確的url更新頁面，但是如果我按下“ lo”，則僅播放“ hi”流（隨瀏覽器加載），它將停止音頻但不播放然后單擊“ hi”，然后再次啟動hi流並正常播放，這很明顯，如按lo stream一樣，播放時間滑塊位於開頭並顯示0； 當與hi一起使用時，它在最后並開始計數：

所以$（document）.ready函數是：

                var audio = $('#audioPlayer');
            $('#hi').on("click", function () {
                audio.attr("src", "http://96.31.83.94:8061/;");
                /****************/
                audio[0].pause();
                audio[0].load();//suspends and restores all audio element
                audio[0].play();
                /****************/
                });

            $('#lo').on("click", function () {
                audio.attr("src", "http://85.17.167.136:8534/;");
                /****************/
                audio[0].pause();
                audio[0].load();//suspends and restores all audio element
                audio[0].play();
                /****************/
                });

播放器和按鈕：

        <div id="audioPanel" class="col-md-12">
        <div class="col-md-4 col-md-offset-4">
            <audio id="audioPlayer" class="audioPlayer" src="http://96.31.83.94:8061/;" controls autoplay>
                Your browser does not support the audio element.
            </audio><br>
            <div id="streamButtons" class="btn-group">
                <button id="lo" class="btn btn-primary btn-xs">Lo</button>
                <button id="hi" class="btn btn-primary btn-xs">Hi</button>
            </div>
        </div>

如果在按下按鈕后我按F5鍵，視圖源不會更改，但是在螢火蟲和檢查元素中它確實更改為正確的“ lo”網址，但由於某些原因無法播放...請幫助。

這顯然不是doc.ready中唯一的東西，但它在列表中排名第一。

編輯：這是啟動lo按鈕后的播放器

   <div id="audioPanel" class="col-md-12">
<div class="col-md-4 col-md-offset-4">
<audio id="audioPlayer" class="audioPlayer" autoplay="" controls="" src="http://85.17.167.136:8534/;"> Your browser does not support the audio element. </audio>
<br>
    <div id="streamButtons" class="btn-group">
<button id="lo" class="btn btn-primary btn-xs">Lo</button>
<button id="hi" class="btn btn-primary btn-xs">Hi</button>
</div>

Answer 1

您的代碼運行正常，除了源代碼為85.17.167.136:8534的廣播無法正常工作，因為其內容類型為audio / aacp，音頻/ aacp周圍帶有ADTS包裝，如下面的Brad所述，HTML5不支持播放器。 因此，我建議您搜索音頻/ mpeg內容，否則您將需要Flash播放器來播放該流。

有關更多信息，請查看： 是否可以使用HTML5 / javascript播放此流？