在ajax调用jplayer之后检索文件位置返回字符串

时间:2012-03-08 16:01:24

标签: php jquery ajax jplayer

我正在使用jplayer为我的制作网站制作一个mpe播放器。我的问题是我给我的访客完整的歌曲听,因此我必须尝试保护我的音乐,所以这是问题所在。 jplayer需要一个字符串,该字符串是要播放的曲目的文件位置。我想做一个ajax调用并返回该位置。我试图在ajax调用之后返回一个变量放置在字符串位置,但是在调用完成之前代码运行了....

继承我的代码:

html标记:

<div id="player"></div>

        <!-- Using the cssSelectorAncestor option with the default cssSelector class names to enable control association of standard functions using built in features -->

        <div id="jp_container" class="demo-container">

            <p>
                <div class="pro"></div>
                <span class="play-state"></span> : <span class="track-name">nothing</span><br />

                of <span class="jp-duration"></span>, which is
                <span class="jp-current-time"></span><br />
            </p>
            <ul class="toolbar ui-widget-header ui-corner-all">
                <li><button class="jp-Prev" href="#">Prev</button></li>
                <li><button class="jp-play" href="#">Play</button></li>
                <li><button class="jp-pause" href="#">Pause</button></li>
                <li><button class="jp-stop" href="#">Stop</button></li>
                <li><button class="jp-Next" href="#">Next</button></li>
                <li><button class="jp-mute" href="#">Mute</button></li>
                <li><button class="jp-unmute" href="#">Unmute</button></li>
                <li><div class="jp-volume-bar"></div></li>
            </ul>
            <ul class="playlist">
                <li><span>Select a track :</span></li>
                <? Beats(); ?>
            </ul>
        </div>

Jquery标记:

    $("#jp_container .track").on("click",function(event) {
        var x = $(this).attr('id');
        var mp3File = // maybe a function can go here
        my_jPlayer.jPlayer("setMedia", {
            mp3: //this is where the string is expected
        });
        my_jPlayer.jPlayer("play"); 
        my_trackName.text($(this).text());
        $(this).blur();
        return false;       
    });
// here is were i get the location in a function i workout already
function url(x){
    var mp3;
    $.ajax({
    type: "POST",
    url: "hosts/beats/beat.php",
    data: "<?=md5('url')?>="+x+"&ok=<?=md5(rand(1,20))?>",
    dataType: "html",
    success:function(data){ var mp3 = data; }   
        }); 
    return mp3; 
}

1 个答案:

答案 0 :(得分:2)

AJAX中的第一个“A”用于ayshnchronous ...你不能从你的函数返回mp3,因为当你尝试返回它时,ajax还没有完成。

您需要在ajax

的成功回调中执行setMedia
$("#jp_container .track").on("click", function(event) {
    var x = $(this).attr('id');

    $.ajax({
        type: "POST",
        url: "hosts/beats/beat.php",
        data: "<?=md5('url')?>=" + x + "&ok=<?=md5(rand(1,20))?>",
        dataType: "html",
        success: function(data) {

            my_jPlayer.jPlayer("setMedia", {
                mp3: data
            });
            my_jPlayer.jPlayer("play");
            my_trackName.text($(this).text());
            $(this).blur();

        }
    });

    return false;
});