2011-05-16 128 views
1

我有一個大型項目爲用戶生成音樂文件列表,並且我想使用jPlayer的實例播放文件,當它處於點擊狀態時。使用jPlayer從數據庫中播放音頻文件

目前,這是在頁面頭部代碼:

$(document).ready(function(){ 

    $("#jquery_jplayer_1").jPlayer({ 
     ready: function() { 
      $(this).jPlayer("setMedia", { 
       mp3: "http://www.jplayer.org/audio/mp3/Miaow-07-Bubble.mp3" //test file 
      }); 
     }, 
     ended: function (event) { 
      $(this).jPlayer("play"); 
     }, 
     swfPath: "/js", 
     supplied: "mp3" 
    }); 

這只是加載初始文件中的代碼,它的工作原理完全。

另外在頭上,我有這個塊,當點擊一行時,改變當前文件。它得到的md5散列設置爲行上的id並將其傳遞給一個返回文件路徑的php文件。我用螢火蟲檢查過它,它似乎正在返回一個有效的路徑。

$("tr").click(function() {  
     var md5 = $(this).attr("id"); 
     var filename = ""; 
     xmlhttp = new XMLHttpRequest(); 
     xmlhttp.onreadystatechange=function(){ 
      if (xmlhttp.readyState==4 && xmlhttp.status==200){ 
       filename = xmlhttp.responseText; 
      } 
     } 
     xmlhttp.open("GET","md5tofilename.php?md5="+md5,true); 
     xmlhttp.send(); 

     $("#jquery_jplayer_1").jPlayer("setMedia", { 
      mp3: filename   
     }); 
     $("#jquery_jplayer_1").jPlayer("play"); 
     return false; 
    }); 
}); 

無論出於何種原因,單擊行不會導致新的文件播放,雖然它沒有設置當前文件。 jPlayer將時間設置爲「0:00」,並表現爲沒有加載文件。

僅供參考,這裏是一個生成的行的例子:

<tr id="bbac3c5090c5ca76ce7a02b8112dec0a" class="row1"> 
    ... 
</tr> 

而且從調用PHP文件中的測試值的響應:

GET http://localhost/md5tofilename.php?md5=1234567890 200 OK 36ms 

"http://www.jplayer.org/audio/mp3/Miaow-07-Bubble.mp3" 

任何深入瞭解我是什麼做錯或造成問題的原因將不勝感激。

回答

2

設置媒體後,然後嘗試播放下一行插件將不準備播放。嘗試這樣的嘗試來嘗試自動播放。

$("#jquery_jplayer_1").jPlayer("setMedia", { 
    mp3: filename   
}).jPlayer("play"); // Attempts to Auto-Play the media