1

在我的页面中有许多 mp3 链接，我使用 jplayer。单击单独的链接时，如何更新 jplayer 功能以播放？

$(document).ready(function() {

 $("#jquery_jplayer_1").jPlayer({

    ready: function(event) {
        $(this).jPlayer("setMedia", {
            mp3: "test_1.mp3",   //my mp3 file

        });
    },
    swfPath: "http://www.jplayer.org/2.1.0/js",
    supplied: "mp3"
  });
});

我的mp3链接：

<a href="javascript:listen(1);" class="jp-play" ></a>
<a href="javascript:listen(2);" class=" jp-play" ></a>
<a href="javascript:listen(3);" class=" jp-play" ></a>
<a href="javascript:listen(4);" class=" jp-play" ></a>
<a href="javascript:listen(5);" class=" jp-play" ></a>
4

2 回答 2

1

嘿，您可以执行以下操作。

我在页面加载时实例化播放器：

jQuery("#jquery_jplayer_1").jPlayer({
swfPath: "http://www.jplayer.org/latest/js/Jplayer.swf",
supplied: "mp3",
wmode: "window",
preload:"auto",
autoPlay: true,
errorAlerts:false,
warningAlerts:false
});

然后在每个项目都是唯一的侦听器中，您需要： A) 获取轨道名称/URL，我想您应该能够弄清楚这一点。

B) 将轨道传递给 setMedia

jQuery("#jquery_jplayer_1").jPlayer("setMedia", {
mp3: "http:xxxx.rackcdn.com/"+track+".MP3"
});

C) 播放曲目

jQuery("#jquery_jplayer_1").jPlayer("play");

要获取曲目 ID，您需要在可播放项目上安装侦听器（可能是可播放类？）并从该项目中获取曲目。

于 2013-03-08T15:31:25.643 回答
0

html:

<a href="test_1.mp3" class="jp-play"></a>
<a href="test_2.mp3" class="jp-play"></a>

js：

$(document).ready(function() {
   readMP3("test_1.mp3");// play one mp3 if document is loaded

    $(".jp-play").click(function(event){
        event.preventDefault();
        readMP3($(this).attr("href"));
    })

});

function readMP3(_src){
 $("#jquery_jplayer_1").jPlayer({
    ready: function(event) {
        $(this).jPlayer("setMedia", {
            mp3: _src,
        });
    },
    swfPath: "http://www.jplayer.org/2.1.0/js",
    supplied: "mp3"
  });
}
于 2012-05-06T14:42:22.047 回答