jplayer:从页面上的链接播放mp3

时间:2014-08-16 19:06:32

标签: javascript html jplayer

我有一个使用jplayer的Html模板,我知道如何在播放器中添加现有播放列表,但不知道如何通过页面上的链接播放。

主题的链接是:http://themeforest.net/item/musik-music-web-application-template/7831557

我试图联系开发者,但他没有活动,也没有回复。请帮忙,。!

另外,我检查了评论,他要求在链接上放置“data-jp-src”属性。

  <a href="#" title="musician" data-jp-src="a.mp3">play</a>

$(document).on('click', '[data-jp-src]', function(e){
  e && e.preventDefault();
  var music = {};
  music.title  = $(this).attr('title');
  music.mp3 = $(this).attr('data-jp-src');
  myPlaylist.add(music);
  myPlaylist.play(-1);
});

我不明白这个

1 个答案:

答案 0 :(得分:1)

打开文件js / jPlayer / demo.js

添加如下代码:

   $(document).on('click', '.jp-play-me', function(e){
    e && e.preventDefault();
    var $this = $(e.target);
    if (!$this.is('a')) $this = $this.closest('a');

    $('.jp-play-me').not($this).removeClass('active');
    $('.jp-play-me').parent('li').not($this.parent('li')).removeClass('active');

    $this.toggleClass('active');
    $this.parent('li').toggleClass('active');
    if( !$this.hasClass('active') ){
      myPlaylist.pause();
    }else{
      var i = Math.floor(Math.random() * (1 + 7 - 1));
      myPlaylist.play(i);
    }
   });

   $(document).on('click', '[data-jp-src]', function(e){
    e && e.preventDefault();
    var music = {};
    music.title  = $(this).attr('title');
    music.mp3 = $(this).attr('data-jp-src');
    myPlaylist.add(music);
    myPlaylist.play(-1);
   });