HTML5音頻「預緊=」無」弄亂了暫停（）和currentTime的（）</p> <p>如果我設置預緊=

我有暫停和重新HTML5音頻的進步一個非常奇怪的問題。‘沒有’，然後「pause（）;」和「currentTime = 0;」將不會執行，當我刪除preload =「none」時，一切正常。網頁在同一位置（意）的HTML 5音頻元素，使用戶可以訪問該頁面時播放頁面的音樂。HTML5音頻「預緊=」無」弄亂了暫停（）和currentTime的（）</p> <p>如果我設置預緊=

$('.link').on('click', function(e){ 
    $('.pagecontainer>div').fadeOut(); 
    $(this.getAttribute("href")).fadeIn(); 
    stopAudio(); 
}); 

function stopAudio() { //fade out and stop any current audio 
    $('audio').animate({volume: 0}, 1000); 
    setTimeout(function(){ 
     $.each($('audio'), function() { 
      this.currentTime=0; 
      this.pause(); 
          alert('audio has been stopped and reset'); 
     }); 
    },1000) 
} 

$('.sound').on('play', function() { //since volume was faded out, reset volume when click play button 
    $('audio').animate({volume: 1}, 100); 
}); 

.... 
.... 

<a href="#page1" class="link">Audio 1</a> 
<a href="#page2" class="link">Audio 2</a> 
<a href="#page3" class="link">Audio 3</a> 

<div class="pagecontainer"> 

    <div id="page1"> //all three audio elements are in exact same spot 
        //clicking page link fades in current audio and fades in new one 
     <audio controls loop class="sound" preload="none"> 
      <source src="../../site/music/music1.mp3"/> 
      <source src="../../site/music/music1.ogg"/> 
     </audio> 
    </div> 

    <div id="page2"> 
     <audio controls loop class="sound" preload="none"> 
      <source src="../../site/music/music2.mp3"/> 
      <source src="../../site/music/music2.ogg"/> 
     </audio> 
    </div> 

    <div id="page3"> 
     <audio controls loop class="sound" preload="none"> 
      <source src="../../site/music/music3.mp3"/> 
      <source src="../../site/music/music3.ogg"/> 
     </audio> 
    </div> 

</div>

當我點擊指向另一個頁面的鏈接時，我需要停止並重置所有三個音頻元素。目前，由於它不停止，當我點擊淡入的音頻元素的播放按鈕時，我聽到兩個音頻同時播放。雖然有趣的是音頻消失了。如上所述，如果我刪除了preload =「none」，那麼alert（'audio has been stopped and reset'）將會觸發，並且一切正常。

有誰知道我只能在需要時才加載音頻（如果我拿出預加載=「無」），那麼我的網站將無法在Chrome中工作，大約20個音樂文件將全部嘗試加載在同一時間導致Chrome掛起），但讓我的腳本工作？

緊急〜謝謝！

來源

2013-03-27 Windbrand

這一點也很重要，因爲所有的iOS設備都執行preload =「none」選項，以避免超載帶寬。只有觸摸事件等用戶輸入才能觸發音頻或視頻加載。這意味着這個問題也會導致iPhone，iPad和iWatches的崩潰！ – eriklinde 2013-07-06 20:01:46

在尚未加載音頻標籤上設置currentTime會觸發DOM異常。因此請確保音頻已加載。只有然後嘗試設置其當前時間。

$("audio").one("loadeddata", function() 
{ 
    $(this).data("dataLoaded", true); 
}); 


$.each($('audio'), function() { 
    if($(this).data("dataLoaded")) 
    { 
     this.currentTime=0; 
     this.pause(); 
    } 
    alert('audio has been stopped and reset'); 
});

來源

2013-05-03 10:22:07

HTML5音頻「預緊=」無」弄亂了暫停（）和currentTime的（）</p> <p>如果我設置預緊=

回答

相關問題