Jplayer - 单击链接并播放播放列表中的歌曲

Question

点击链接后如何在播放列表中播放歌曲？看起来Jplayer会自动生成一个列表组。在这种情况下，我想链接一个图像以在播放列表中启动一个mp3文件。

<a class="track" href="/TSP-01-Cro_magnon_man.mp3"><img src=''></a>

这是脚本

$(document).ready(function() {

  var myPlaylist = new jPlayerPlaylist({
    jPlayer: "#jquery_jplayer_1",
    cssSelectorAncestor: "#jp_container_1"
  }, [{
    title: "Cro Magnon Man",
    artist: "Mushroom Records",
    mp3: "http://www.jplayer.org/audio/mp3/TSP-01-Cro_magnon_man.mp3",
    oga: "http://www.jplayer.org/audio/ogg/TSP-01-Cro_magnon_man.ogg"
  }, {
    title: "Your Face",
    artist: "Ministry",
    mp3: "http://www.jplayer.org/audio/mp3/TSP-05-Your_face.mp3",
    oga: "http://www.jplayer.org/audio/ogg/TSP-05-Your_face.ogg"
  }, {
    title: "Thin Ice",
    artist: "Screaming Trees",
    mp3: "http://www.jplayer.org/audio/mp3/Miaow-10-Thin-ice.mp3",
    oga: "http://www.jplayer.org/audio/ogg/Miaow-10-Thin-ice.ogg"
  }], {
    swfPath: "../../dist/jplayer",
    supplied: "oga, mp3",
    wmode: "window",
    useStateClassSkin: true,
    autoBlur: false,
    smoothPlayBar: true,
    keyEnabled: true
  }); // end jplayer initiate

  /* ======== Other Audio Player Functions ======== */

  $("#jquery_jplayer_1").on(
    $.jPlayer.event.ready + ' ' + $.jPlayer.event.play,
    function(event) {

      /* === ENABLE PLAYLIST ==== */

      var current = myPlaylist.current;
      var playlist = myPlaylist.playlist;
      $.each(playlist, function(index, obj) {
        if (index == current) {
          $(".jp-now-playing").html("<div class='jp-track-name'>" + obj.title + "</div> <div class='jp-artist-name'>" + obj.artist + "</div>");

        }
      });

      /* === VOLUME DRAGGING ==== */

      $('.jp-volume-bar').mousedown(function() {
          var parentOffset = $(this).offset(),
            width = $(this).width();
          $(window).mousemove(function(e) {
            var x = e.pageX - parentOffset.left,
              volume = x / width
            if (volume > 1) {
              $("#jquery_jplayer_1").jPlayer("volume", 1);
            } else if (volume <= 0) {
              $("#jquery_jplayer_1").jPlayer("mute");
            } else {
              $("#jquery_jplayer_1").jPlayer("volume", volume);
              $("#jquery_jplayer_1").jPlayer("unmute");
            }
          });
          return false;
        })
        .mouseup(function() {
          $(window).unbind("mousemove");
        });

      /* === ENABLE DRAGGING ==== */

      var timeDrag = false; /* Drag status */
      $('.jp-play-bar').mousedown(function(e) {
        timeDrag = true;
        updatebar(e.pageX);
      });
      $(document).mouseup(function(e) {
        if (timeDrag) {
          timeDrag = false;
          updatebar(e.pageX);
        }
      });
      $(document).mousemove(function(e) {
        if (timeDrag) {
          updatebar(e.pageX);
        }
      });

      //update Progress Bar control
      var updatebar = function(x) {

        var progress = $('.jp-progress');
        //var maxduration = myPlaylist.duration; //audio duration

        var position = x - progress.offset().left; //Click pos
        var percentage = 100 * position / progress.width();

        //Check within range
        if (percentage > 100) {
          percentage = 100;
        }
        if (percentage < 0) {
          percentage = 0;
        }

        $("#jquery_jplayer_1").jPlayer("playHead", percentage);

        //Update progress bar
        $('.jp-play-bar').css('width', percentage + '%');
      };

      /* === Playlist Functions ==== */

      $('#playlist-toggle').on('click', function() {
        $('#playlist-wrap').stop().fadeToggle();
        $(this).toggleClass('playlist-is-visible');
      });

    }); // end jplayer event ready

}); // end document ready