如何獲取音頻標籤播放？

我正在基於庫中的當前圖像動態更改HTML5音頻標籤源。如何獲取音頻標籤播放？

但我的HTML5音頻播放器根本無法播放。

這裏是我的球員：

<div id="audioPlayer"> 
    <a onclick="playSound()"> 
     <audio class="audioPlayer" preload="none" controls src=""> 
      <source type="audio/ogg" src="" class="audio-ogg" /> 
      <source type="audio/mpeg" src="" class="audio-mp3" /> 
      <source type="audio/wav" src="" class="audio-wav" /> 
     </audio> 
     <img src="img/playBtn.png" alt="Play" /> 
    </a> 
</div> 


function loadSound(galleryIndex) { 
    document.getElementsByClassName('audio-ogg')[0].src = "sounds/" + galleryAudio.sounds[galleryIndex].ogg; 
    document.getElementsByClassName('audio-mp3')[0].src = "sounds/" + galleryAudio.sounds[galleryIndex].mp3; 
    document.getElementsByClassName('audio-wav')[0].src = "sounds/" + galleryAudio.sounds[galleryIndex].wav; 
} 

function playSound() { 
    // galleryAudio.tag.play(); 
    // console.log(document.getElementsByClassName('audioPlayer')[0]); 
    galleryAudio.tag.play(); 
    return false; 
} 

function initialise() { 
    galleryAudio.tag = document.getElementsByClassName('audioPlayer')[0]; 
} 

var galleryAudio = { 
    tag: null, 
    sounds: [{ 
      "ogg": "square.ogg", 
      "mp3": "square.mp3", 
      "wav": "square.wav" 
     }, { 
      "ogg": "rectangle.ogg", 
      "mp3": "rectangle.mp3", 
      "wav": "rectangle.wav" 
     }, { 
      "ogg": "circle.ogg", 
      "mp3": "circle.mp3", 
      "wav": "circle.wav" 
     }, { 
      "ogg": "equilateral-triangle.ogg", 
      "mp3": "equilateral-triangle.mp3", 
      "wav": "equilateral-triangle.wav" 
     }, { 
      "ogg": "isosceles-triangle.ogg", 
      "mp3": "isosceles-triangle.mp3", 
      "wav": "isosceles-triangle.wav" 
     }, { 
      "ogg": "right-angle-triangle.ogg", 
      "mp3": "right-angle-triangle.mp3", 
      "wav": "right-angle-triangle.wav" 
     }, { 
      "ogg": "scalene-triangle.ogg", 
      "mp3": "scalene-triangle.mp3", 
      "wav": "scalene-triangle.wav" 
     }, { 
      "ogg": "pentagon.ogg", 
      "mp3": "pentagon.mp3", 
      "wav": "pentagon.wav" 
     }, { 
      "ogg": "hexagon.ogg", 
      "mp3": "hexagon.mp3", 
      "wav": "hexagon.wav" 
     }, { 
      "ogg": "heptagon.ogg", 
      "mp3": "heptagon.mp3", 
      "wav": "heptagon.wav" 
     }, { 
      "ogg": "octagon.ogg", 
      "mp3": "octagon.mp3", 
      "wav": "octagon.wav" 
     } 
    ] 
}; 

window.addEventListener('load', initialise, true);

爲什麼我的音頻播放機上播放？

來源

2013-04-20 Jamesking56

''做什麼？ – 2013-04-20 23:55:04

在我的自定義播放按鈕上調用我的播放聲音方法 – Jamesking56 2013-04-20 23:59:06

您正在測試哪個瀏覽器？ – razzak 2013-04-21 00:16:48

我定了！

原來，如果音頻標籤中有<source>標籤src=""，它會嘗試播放空白音頻源。

我只是要刪除，嘿presto！

來源

2013-04-21 00:21:14 Jamesking56

因爲loadSound永遠不會被調用。

window is loaded 
    └─ initialise() 

button clicked 
    └─ playSound() 
     └─ galleryAudio.tag.play()

試試這個：

<audio oncanplay="playSound()" src="...">

來源

2013-04-21 00:07:17

loadSound是從另一個JS文件中調用的，該文件鏈接到圖庫圖像。我已通過在函數 – Jamesking56 2013-04-21 00:11:15

@ Jamesking56中添加一個'alert（）'來驗證此作品 - 然後可能是因爲聲音文件尚未加載。你等了一會兒，看看？ – 2013-04-21 00:12:56

該文件是本地文件，我等了一會兒，但仍然無法通過我的自定義播放按鈕或默認播放控件 – Jamesking56 2013-04-21 00:15:35

如何獲取音頻標籤播放？

回答

相關問題