html5音頻元素返回src與jquery

我正在轉換一些HTML5與Android一起工作。 Android不支持該元素，所以play方法不起作用。html5音頻元素返回src與jquery

我正在使用PhoneGap的媒體元素，並且播放音頻。我想要的是找到音頻標籤的第一個來源，然後將其用於媒體播放，但這似乎不起作用。

function playSound(whatToPlay) { 
    // removed since <audio does not work 
    // var snd = document.getElementById(whatToPlay); 
    // snd.play(); 

    toPlaySrc = $("#"+whatToPlay+":first-child").eq(0).attr("src"); 
    // next I will have to deal with /android_asset and my current partial path 
    myMedia = new Media("/android_asset/"+toPlaySrc, onSuccess,onError); 
    if (myMedia) 
     myMedia.play();   
} 
playSound("clockticking");

這是我的音頻元素。

<audio id="clockticking" preload="auto" autobuffer onEnded="instructionFinsihed()"> 
    <source src="../sound/tictoc.mp3" type="audio/mp3" /> 
    <source src="../sound/tictoc.ogg" type="audio/ogg" /> 
</audio>

我有很多現有的音頻元素，所以一般的解決辦法真的很重要，我不能，例如只是廣告ID代碼應用到所有的MP3元素並加以解決。

來源

2012-05-07 nycynik

我正在研究一個小的lib，您可以將其添加到Cordova/PhoneGap Android來修復像這樣的修補程序問題。我會及時向大家發佈。 –

謝謝！我相信我不能成爲這個問題唯一的一個。 – nycynik

好的，我正在研究Android WebView的一些猴子補丁代碼，您可以在我的corinthian github project上看到進度。在你想要做什麼，同時是設置一個上deviceready聽衆：

document.addEventListener("deviceready", monkeypunch, true);

創建一個數組來保存的媒體對象：

mediaObjs = [];

，並在加藤一彥方法，你會怎麼做：

function monkeypunch() { 
    var audioclips = document.getElementsByTagName("audio"); 
    for (var i=0; i < audioclips.length; i++) { 
     // Create new Media object. 
     var audioSrc = audioclips[i].firstElementChild.src; 
     if (audioSrc.indexOf("file:///android_asset") == 0) { 
      audioSrc = audioSrc.substring(7); 
     } 
     mediaObjs[audioSrc] = new Media(audioSrc); 
     // Create the HTML 
     var newAudio = document.createElement('div'); 
     var newImg = document.createElement('img'); 
     newImg.setAttribute('src', 'images/play.png'); 
     newAudio.appendChild(newImg); 
     // Set the onclick listener 
     newAudio.addEventListener("click", function() { 
      // figure out what image is displayed 
      if (newImg.src.indexOf("images/play.png", newImg.src.length - "images/play.png".length) !== -1) { 
       newImg.src = "images/pause.png"; 
       mediaObjs[audioSrc].play();    
      } else { 
       newImg.src = "images/play.png"; 
       mediaObjs[audioSrc].pause();     
      } 
     }); 
     // replace the audio tag with out div 
     audioclips[i].parentNode.replaceChild(newAudio, audioclips[i]); 
    } 
}

你可以從我的github項目中獲取播放/暫停圖像。我計劃在我有更多時間時添加更多功能。

來源

2012-05-08 13:44:48

現在試一試，謝謝。 – nycynik

html5音頻元素返回src與jquery

回答

相關問題