使用jQuery控制頁面上的HTML5音頻

我在我的網站上構建了一個使用HTML5動畫編碼的簡單瀏覽。它將使用HTML5音頻標籤中的聲音，並將使用jquery加載遊覽。使用jQuery控制頁面上的HTML5音頻

巡迴加載時，它將開始播放音頻，用戶可以通過切換鏈接來靜音。如果他們關閉了巡演，那麼音頻重置！

我有這個工作的一部分，但似乎不能正確地開關音樂，然後完全停止它，如果他們關閉旅程。誰能幫忙？

var sound; 

      $(document).ready(function() 
      { 
       sound = $('#soundTour'); 

       $('.sound a').click(function() 
       { 
        $(this).parents('div').toggleClass('mute'); 

        if (sound.paused) 
        { 
         sound.play(); 
        } 
        else 
        { 
         sound.pause(); 
        } 
       }); 

       $('.showTour').click(function() 
       { 
        $('body').addClass('theatre'); $('#tour').fadeIn('slow', function() { }); 

        sound.trigger('play'); 
       }); 

       $('#tour').find('.tourClose').click(function() 
       { 
        $('body').removeClass('theatre'); $('#tour').fadeOut('slow', function() { }); 

        sound.currentTime=0; 
        sound.pause(); 

       }); 

      });

來源

2011-12-10 Cameron

據透露，像'音頻＃選擇soundTour'可能不僅僅是'＃soundTour'慢，因爲後者將使用'getElementById'肯定的，而一個與標籤名*至少*必須檢查所選元素的標籤名稱 - 並且由於ID必須是唯一的，所以您無需使用'id =「soundTour」'元素。 – ThiefMaster

您正在使用jQuery的觸發器（）來觸發未在發佈的代碼中定義的事件，因此它很難真正說什麼「站」是的，但作爲一般規則HTML5音頻不會有一個stop（）函數，只玩（）和pause（），重置音頻只需重新定義源或.currenttime設置爲零，像這樣：

var audioElm = document.getElementById('soundTour'); 
    audioElm.src = 'myaudio.mp3'; 
    audioElm.load();

或

var audioElm = document.getElementById('soundTour'); 
    audioElm.currentTime=0; 
    audioElm.pause();

設置當前Ti我只將音頻倒回到開頭，並沒有真正阻止它。

這裏有一個小提示，以顯示一種做法。它使用一個MP3文件，使您的瀏覽器必須支持這種格式：http://jsfiddle.net/adeneo/n6Bar/1/

來源

2011-12-10 12:27:22 adeneo

我只是得到的錯誤，說這些方法是無效的jQuery方法 – Cameron

@Cameron我編輯了我的答案，我的壞，因爲HTML5音頻功能是本機的，應該在本地js元素上執行。 – adeneo

使用jQuery控制頁面上的HTML5音頻

回答

相關問題