Question

我正在尝试在jplayer上添加下一个按钮。我已经尝试使用点击功能，但它不起作用。

播放器的设置方式是使用ajax获取歌曲和歌曲信息。当歌曲结束时，它也将通过使用ajax获得另一首歌曲。试图做的是添加下一个按钮，但我不知道如何。有什么想法吗？

$(document).ready(function () {
    $("#jquery_jplayer_1").jPlayer({
        ready: function () {
            var data = $.ajax({
                url: "getsong.php",
                async: false
            }).responseText;
            var string = data.split('|');
            $(this).jPlayer("setMedia", {
                mp3: string[0]
            }).jPlayer("play");
            $('#artist').html(string[1]);
            $('#songname').html(string[2]);
            $('#album').html("<img src='" + string[3] + "' width='250' height='250' />");
        },
        ended: function (event) {
            var data = $.ajax({
                url: "getsong.php",
                async: false
            }).responseText;
            var string = data.split('|');
            $(this).jPlayer("setMedia", {
                mp3: string[0]
            }).jPlayer("play");
            $('#artist').html(string[1]);
            $('#songname').html(string[2]);
            $('#album').html("<img src='" + string[3] + "' width='250' height='250' />");
        },
        swfPath: "js",
        supplied: "mp3"
    });
});

Answer 1

正如你所说，当一首歌结束时，你的代码将获取下一首歌曲。因此，粗略地说，您可以自己创建一个按钮并在其上定义click事件，当您点击时，它应该触发jplayer的ended事件。

例如：

<input type='button' id='next-song' />

<强>脚本：

$('#next-song').click(function(){
  $("#jquery_jplayer_1").trigger($.jPlayer.event.ended);
})

您还可以查看必须使用Playlist插件的文档。它将包含播放列表中的歌曲列表，您可以在next()上执行previous()，playlist和其他操作。

在jplayer上添加下一个按钮

1 个答案: