1

我有一个为用户生成音乐文件列表的大型项目,我想在单击文件时使用 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"
    });

这只是加载初始文件的代码,它完全可以工作。

同样在头部,我有这个块可以在单击一行时更改当前文件。它获取在行上设置为 id 的 md5 哈希,并将其传递给返回文件路径的 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"

任何对我做错了什么或导致问题的原因的见解将不胜感激。

4

1 回答 1

2

设置媒体并尝试在以下行上播放后,插件还没有准备好播放。尝试这样的事情来尝试自动播放。

$("#jquery_jplayer_1").jPlayer("setMedia", {
    mp3: filename           
}).jPlayer("play"); // Attempts to Auto-Play the media
于 2012-01-19T16:47:02.597 回答