只在網頁上啓用一個音頻流

我正處於建立樂隊網站的初期階段，其中有很多樣本音頻流。每個流通過單獨的「播放」和「暫停」按鈕觸發或停止。網頁上還有許多視頻都有自己的控件。我用下面的代碼用於設置音頻樣本：只在網頁上啓用一個音頻流

$("#play0").click(function() { 

    $("#audio0").trigger('play'); 

}); 


$("#pause0").click(function() { 

    $("#audio0").trigger('pause'); 

});

的「音頻0」 ID是爲每個音頻流（上升到「音頻9」），而「play0」和「pause0」的ID（也可以達到「播放/暫停9」）按鈕。我如何確保在任何時候只播放一個音頻文件（不論是音頻還是視頻）。換句話說，用戶不能觸發多個音頻流同時播放。謝謝。

來源

2014-10-12 Raipod

嘗試這樣的事情

var media = $('audio, video'); 

    function pauseAll() { 
     media.each(function() { 
      var element = $(this).get(0); 
      element.pause(); 
     }); 
    } 


    $("#play0").click(function(){ 
     pauseAll(); 
     $("#audio0")[0].play(); 
    });

來源

2014-10-12 06:54:00

謝謝，坦博。你的代碼像魅力一樣工作。但是，我必須刪除每個VIDEO中的「controls」屬性並定義單獨的PLAY和PAUSE按鈕。通過這樣做，我失去了讓用戶將視頻轉換爲全屏顯示的能力，這是「控件」屬性的一部分。我嘗試手動插入「allowfullscreen」屬性，但它似乎不工作。所以現在我需要的解決方案能夠讓用戶選擇全屏觀看視頻。除此之外，你的代碼是一個守護者！ – Raipod 2014-10-12 21:51:37

我回到了我的頁面，現在我意識到如果您右鍵單擊視頻，可以選擇在「顯示」和「隱藏」控件之間切換。如果您選擇「顯示」控件，則可以在視頻上看到整個「控件」面板，包括圖標全屏顯示。但是，這不是一個很好的解決方案，尤其是因爲它還顯示「controls」屬性附帶的「播放」和「暫停」按鈕。這可能會讓用戶感到非常困惑。 – Raipod 2014-10-12 22:24:58

只在網頁上啓用一個音頻流

回答

相關問題